0 votes
asked by (170 points)
edited by


As the title say I have a little problem changing the background color.

I implement a theme selector to my project and work perfectly, but today when I open it, the color of the background stop changing

I'm using Sugarcube 2.21 in twine 2

Edit: http://twinery.org/questions/5167/settings-menu-option-to-change-stylesheets?show=5173#a5173 I take the code from there

This is the code in the javascript section

var settingThemeNames = ["(none)", "1", "2", "3", "4"];
var settingThemeHandler = function () {
	// cache the jQuery-wrapped <html> element
	var $html = $("html");

	// remove any existing theme class
	$html.removeClass("theme-1 theme-2 theme-3 theme-4");

	// switch on the theme name to add the requested theme class
	switch (settings.theme) {
	case "1":
	case "2":
	case "3":
	case "4":
Setting.addList("theme", {
	label    : "Choose a theme.",
	list     : settingThemeNames,
	onInit   : settingThemeHandler,
	onChange : settingThemeHandler


And this in the CSS section

html.theme-1 body
 background-color: #3C1642;
html.theme-1 .passage
 color: #005095;
html.theme-1 #ui-bar
  background-color: #462255;
  color: #1DD3B0;
html.theme-1 .passage a
html.theme-1 .passage a:hover
html.theme-1 #ui-dialog-body.saves
  background-color: #462255;
  color: #1DD3B0;
html.theme-1 #ui-dialog-body.settings
  background-color: #462255;
  color: #1DD3B0;

Someone know why this stop working only on the background?

1 Answer

0 votes
answered by (131k points)

> I can't find again from where I take the code..

I would guess you got it from either this answer by TheMadExile or from this answer by me (which is based on TheMadExile's)

> This is the code in the java section

You mean the JavaScript section, Java is a different and unrelated programming language.

> the color of the background stop changing

I created a new SugarCube 2 based project and tested your examples in it and they worked correctly.

Have you made any recent edits to the Story Javascript area of your project?

Could you please run your story HTML file again in your web-browser and open it's Developer Console to check if there are any error messages in it, how you open this console depends on which web-browser & Operating System combination you are using (although generally the F12 key on your keyboard will open the web-browser's Web Developer Tool window, and Console should be one of the tabs in that window's action bar)

commented by (170 points)
Thanks for the link and the correction on the javascript thing.

I try on different browsers and in everyone happens the same, I didn't change anything, literally close and open twine and stop working, I'll try reinstall it, but have no idea what could probably cause it
commented by (131k points)
DId you look at your web-browser's Developer Console which playing your story HTML file? Were there any error messages?

If you need more help and are willing to upload your story HTML file to a file hosting site then I can look at it to see what is causing the issue.
Welcome to Twine Q&A, where you can ask questions and receive answers from other members of the community.

You can also find hints and information on Twine on the official wiki and the old forums archive.

See a spam question? Flag it instead of downvoting. A question flagged enough times will automatically be hidden while moderators review it.