Боковые элементы «выезжают и уезжают» по горизонтали при скроллинге, как это реализовать?
Пример того, что нужно, есть на этом сайте. tds74.su
У меня всего 2 элемента которые должны приезжать и уезжать. Я думал сделать это с помощью позишен абсолют и изменения текущей позиции элемента.
Вот с функцией "сделать что то при скролле" я знаком. А вот как плавно менять позиционирование элемента ?
Функция .scrollTop() в jQuery высчитывает скролл от верхнего края. Тебе нужно в зависимости от неё менять left/right/top/bottom элементу
Так понятно?))
UPD: не абсолют, а fixed. Иначе подбирать высоту запаришься. Посмотри внимательнее на пример, ссылку на который кинул
Novamoscow: чего именно непонятно? За плавность отвечает transition в css, ставьте какое нравится
Допустим, есть блок с классом left-block, который фиксирован и сдвинут влево left: -1000px
var left = $('.left-block').css('left');
$(window).scroll( function(){
if ( $(window).scrollTop() > 200 ) {
left = left - $(window).scrollTop();
$('.left-block').css('left': left )
}
});
Естественно, это просто пример. Можно и покрасивее написать, но мне лень
Novamoscow: эти?
left = left + $(window).scrollTop();
$('.left-block').css('left': left )
1 - пересчитывает значение left в зависимости от скролла. Была опечатка, должен быть +, конечно.
2 - добавляет значение переменной left в css-свойство блока
И так при каждом изменении скролла, хоть на пиксель.
Простой
