3

我正在开发一个 WP8 HTML5 游戏,并试图响应用户选择的主题。

我知道我可以在 CSS 中使用 Background 标签

body {
    font-size: 11pt;
    font-family: "Segoe WP";
    letter-spacing: 0.02em;
    background-color: Background;
    color: #FFFFFF;
    margin-
}

所以现在背景从黑色变为白色,但不是文本颜色,显然是因为我将它设置为#FFFFFF

我尝试在 javascript 中更改它,但奇怪的是,当我尝试 document.body.style.backgroundcolor 时它返回“”,甚至使用由 HEX 或 RGB 设置的变量也会返回 false。

有人对此有解决方案吗?

4

3 回答 3

1

MainPage.xaml.cs

private void Browser_Loaded(object sender, RoutedEventArgs e)
{
    Browser.IsScriptEnabled = true;

    // Add your URL here
    Browser.Navigate(new Uri(MainUri, UriKind.Relative));



    Browser.Navigated += (o, s) => {
        string theme = ((Visibility)Application.Current.Resources["PhoneLightThemeVisibility"] == Visibility.Visible) ?
            "light" : "dark";

        Browser.InvokeScript("eval", String.Format("document.body.className += ' {0}'", theme));
    };

}

电话.css

body {
    font-size: 11pt;
    font-family: "Segoe WP";
    letter-spacing: 0.02em;
    background-color: Background;
    margin-left: 24px;
}

.light {
    color: #000000;
}

.dark {
    color: #FFFFFF;
}
于 2013-04-22T15:03:53.353 回答
0

document.body.style.backgroundcolor拼写错误...

尝试:document.body.style.backgroundColor
使用大写字母C

要更改正文的颜色文本,您可以使用document.body.style.color


编辑:

顺便说一句,可能有更好的方法来解决您的问题,如果您要更改很多 css 属性,您应该创建 css 类,如下所示:

body {
    /* default body css */
}

.myFirstColorSet {
    background-color: #FFF;
    color: #000;
    ...
}

.mySecondColorSet {
    background-color: #000;
    color: #FFF;
    ...
}

然后用javascript,只需切换body类

document.body.className = "mySecondColorSet";

这是这个例子的小提琴:http: //jsfiddle.net/promatik/K75TG/

于 2013-04-19T01:52:51.767 回答
0

虽然上面的 XAML 有效,但这个简单的 jQuery 脚本也有效

  <script>
    if ($("body").css("background-color") == 'rgb(0, 0, 0)'){
      $("body").css("color","rgb(255, 255, 255)");
    }
    else{
      $("body").css("color","rgb(0, 0, 0)");
    }
  </script>
于 2013-05-06T18:00:21.227 回答