. Функция позиционирования позиционирования мерцает в google chrome после последнего обновления

, честно говоря, я немного отчаялся.. Функция позиционирования позиционирования мерцает в google chrome после последнего обновления

После обновления браузера Google Chrome - от версии 39 до 41 - один из моих сайтов клиентов абсолютно изуродован в Chrome.

Вы можете увидеть здесь: http://prinovis-media-day.com/

Если вы прокрутите вниз, все »параллакса« элементы мерцает. Я проверил это на моем MacBook от версии 39 - это абсолютно нормально в версии 39.

В принципе, то, что я делаю, чтобы создать этот эффект очень прост:

$("window").scroll(function(){ 

    var move_value = Math.round(scroll_top * 0.3); 
    var opacity_value = *some other value*; 

    $(".parallax-container__content").css({ 

     'opacity': opacity_value, 
     'padding-top': move_value +'px' 

    }); 

});

Кто-нибудь знает В чем дело? Он работал как прелесть перед этим обновлением ...

Большое спасибо, я действительно ценю любой ответ!

источник

2015-04-07 user3561012

Вы всегда можете кэшировать элемент $ (". Parallax-container__content") в переменной, чтобы он не извлекал его при каждом запуске события прокрутки, и это также относится к значению непрозрачности (если это не динамически изменяя в зависимости от scroll_tp.Это может привести к ускорению сценария и помогите jank, который происходит –

FYI: отлично работает на моем «Chrome 40.0.2214.115 m» – OddDev

Вы можете попробовать добавить «переход» к CSS в " .prallax-container_content ". http://www.w3schools.com/css/css3_transitions.asp – OddDev

Moving мои комментарии, чтобы быть ответ:

Вы всегда можете кэшировать $ («параллакса container__content») элемент в переменной, так что он не запрашивает его каждый раз, когда свиток событие вызывается, и что идет на значение непрозрачности тоже (если этот не динамически изменяется в зависимости от scroll_tp. Делать это может привести к сценарий для ускорения и помочь Jank, что происходит

Если это все еще очень заметно , то вы можете использовать функцию обнаружения , чтобы определить, поддерживаются ли CSS-преобразования в браузере и пользователя 'transform: translate' вместо изменения значения 'top'. Если это не поддерживается, просто вернитесь назад к изменению «сверху». Изменение «top» вызывает перерисовку в браузере, а «переводить» - нет. Эта перекраска довольно дорога браузеру и может вызвать зависание на определенных машинах. modernizr.com может помочь вам с функцией обнаружения , но это потенциально избыточно, просто помогая в в этой ситуации.

Взгляните на это для обнаружения cetain стили поддерживаются: http://lea.verou.me/2009/02/check-if-a-css-property-is-supported/

это самый простой способ проверить (не забудьте учесть префиксы).

источник

2015-04-07 10:34:42

. Функция позиционирования позиционирования мерцает в google chrome после последнего обновления

ответ

Смежные вопросы