Вопросы Теги

Мобильный блок Webkit JQuery для встроенного перехода не работает

Я пытаюсь изменить ориентацию для работы в мобильных браузерах. При изменении ориентации div "wrapStat" должен переключаться между встроенным и блочным отображением.

Этот полный блок текста заменяется каждые X секунд вызовом ajax, поэтому добавление стиля к самому классу wrapStat не будет работать. Я меняю родительский класс #CustomStats между PortraitCustomStats и landscapeCustomStats в зависимости от ориентации.

Это работает в Firefox (изменение размера браузера приведет к переворачиванию флага ориентации), но не работает в любом браузере webkit, пока не сработает вызов ajax.

Есть ли проблема с webkit и динамическим изменением встроенных и блочных стилей?

css:

.portraitCustomStats .StatsRow .wrapStat {
    display: block !important;
}
.landscapeCustomStats .StatsRow .wrapStat {
    display: inline !important;
}

javascript:

$(window).bind('orientationchange', function (anOrientationEvent) {
    if ($(window).width() > 600) return;
    $("#CustomStats").attr("class", anOrientationEvent.orientation.toLowerCase() + "CustomStats").trigger("updatelayout");
});

HTML:


    
      Unique Visitors
        
          
            
            

              (1,318)
                increase
                85.43%

Вот jsFiddle кода, который на самом деле не работает...

http://jsfiddle.net/Hupperware/43eK8/5/

Мобильный вид: http://jsfiddle.net/m/rat/

Это работает в Firefox (текст становится красным в «пейзажной» и синим в «портретной», чтобы вы знали, что это работает). В FF он будет отображаться встроенным и блокироваться при переходе между широким и узким представлениями...

В Webkit (Safari и Chrome) это не будет...

5
задан Hupperware 25 May 2012 в 21:38
поделиться