I'm using Twine 2, SugarCube 2.
I know that this is probably something very basic, but I haven't been able to make it work.
How do I change the background color and image for different passages?
In
my game, currently I have a black background with a forest image for the entire game. But since I plan to continue the game and make it longer, I'm gonna need to change the background image starting from a particular passage.
I've found some similar discussions in the forums, but following those instructions isn't giving me the results I want. I was able to change the background of the text, but not the background of the actual page itself.
To summarize, I want the background image to be a forest until a certain passage, and once you reach that passage, I want it to be an image of a house. How can I do that?
Comments
note: Ideally you would assign your custom classes to the body element but unfortunately classes manually assigned to this element are automatically removed each time the Reader navigates between passages, because of this the following uses the html element instead although the style rules will still target the body element and it's children.
The following four passage example is written in TWEE Notation. ... notice you need to remove the current class before adding the next one to transition from one set of CSS rules to the next.
Placing the following example CSS within your story's Story Stylesheet area, it assigns the correct background colours to the body element.
Theoretical question -- what happens if, say, it's possible to go back from the desert to the forest, and then return to the desert and continue? Would I put in the forest passages that you can return to, even though the first time you enter them there's no "desert" class to remove?
If you need to send the Reader from one class section to another and the target passage is not the normal start-of-section passage then you can do one of two things:
1. Add the remove/add class macro calls to the target passage.
2. Add the remove/add class macro calls to the link targeting that passage.
Replace the code of the Forth passage in my previous example with the following, it shows how to use <<removeclass>> to unconditionally remove all existing classes before adding this section's class, it also shows how to set the class of a passage targeted by a link.