2013-04-19 5 views
3

Я работаю над WP8 HTML5 Game и стараюсь реагировать на тему, которую выбрал пользователь.Windows Phone 8 Приложение HTML5 и темы

Я знаю, что могу использовать фоновую тег в CSS

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.

У кого-нибудь есть решение?

ответ

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)); 
    }; 

} 

phone.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; 
} 
0

document.body.style.backgroundcolor написано с ошибками ...

Try: document.body.style.backgroundColor
С C в верхнем регистре.

Чтобы изменить тэ цвет текста тела вы можете использовать document.body.style.color


EDIT:

Кстати, вероятно, есть лучший способ решить проблему, если вы собираетесь изменить много свойств CSS, вы должны создать классы CSS, как это:

body { 
    /* default body css */ 
} 

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

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

А потом с яваскриптом, J усть переключатель тела класса

document.body.className = "mySecondColorSet"; 

Вот скрипка в этом примере: http://jsfiddle.net/promatik/K75TG/

+0

Извините, что опечатка не была проблемой. также на создании классов, которые были бы замечательными, если бы я хотел, чтобы пользователи меняли тему из приложения, но я создаю это в Windows Phone 8, где тема контролируется ОС и передается в приложение с использованием фонового цвета : Задний план; и цвет: выделить; варианты, но я ищу, чтобы что-то было обратным фону для использования в цветовом теге – Torvos

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>