Очень интересует параллакс-эффект. Все примеры которые видел в интернете имеют полосу прокрутки, основная масса из них имеет обработчик событий $(window).scroll(); Мне же интересна ситуация, когда нет полос прокрутки, соответственно этот обработчик событий не подойдет. У кого-нибудь есть мысли как это реализовать? Я сделал <div class="wrapper'> с большой высотой, поместил туда несколько блоков и обработчик событий прицепил к div.wrapper. div.wrapper имеет большую ширину чем body, у него стоит свойство overflow: auto, у body соответственно overflow: hidden, чтобы скрывало полосу прокрутки у div.wrapper.   Так вот проблема возникает при прокрутке в разные стороны. Почему то в одну сторону все объекты двигаются дальше чем в другую, при долгом ерзанье туда сюда все объекты просто уезжают за пределы окна. Есть у кого какие-нибудь идеи как это реализовать на jQuery?
Буду очень благодарен:)

p.s. Может кто посоветует какую-нибудь литературу по данной теме. Спасибо

1site Сообщение 06/06/2012 12:33 Копия темы
На Хабре было несколько статей с примерами, я читал, понравилось, хотя реально не использовал. 
Вот например: habrahabr.ru/post/142137/

Остальное думаю найдете.

dr_sasha Сообщение 06/06/2012 13:14 Копия темы
Я эту статью читал, очень хорошая, спасибо. 

Но в моем случае такой вариант не подходит. Я пробовал применить все, что написано в статье, все хорошо работает с полосой прокрутки, когда событие привязано к объекту window. У меня немного не так и поэтому вызывает некоторую трудность:(

dkeen Сообщение 06/06/2012 13:16 Копия темы
на движение мышкой надо?

dkeen Сообщение 06/06/2012 13:26 Копия темы
stephband.info/jparallax/... вот если что

dr_sasha Сообщение 06/06/2012 13:27 Копия темы
Да, на колесо. Направление прокрутки смог поймать, а величина сдвига как-то хромает. Например указываешь $('.box').css('top', x+delta); , где x первоначальное положение блока, а delta=$('.wrapper').scrollTop(); , причем delta меняет знак в зависимости от направления прокрутки, так почему-то при движении назад блок на свое место не становится, в разных вариациях может оказаться либо выше либо ниже первоначального положения.

dr_sasha Сообщение 06/06/2012 13:29 Копия темы
Спасибо, буду сейчас изучать:)

trushka Сообщение 06/06/2012 20:18 Копия темы
Лучше, по-моему, использовать множественный background и для каждого задавать background-position в зависимости от scrollTop, ато если box внутри wrapper'a и вылазит за его "внутренние размеры", то он меняет и его scrollHeight и соответственно scrollTop может тоже меняться. Просто надо тогда каколй-нибуть inner-wrapper делать с overflow:hidden, а туда уже box пихать, если css3 не хочется или там контент какой надо дополнительный на заднем плане параллаксить. А вообще scroll()  можно  не только на window вешать,  тогда mousewheel() не нужно отслеживать, мало того, будет работать даже на тачскрине и при прокрутке стрелками на клавиатуре (хотя последнее не работает почему-то в опере, причём, по-моему, в старых версиях работало)

dr_sasha Сообщение 06/06/2012 21:02 Копия темы
С множественным background вариант мне не совсем подходит, а вот контролировать колесо мыши с помощью mousewheel() я не додумался, буду копать в этом направлении. Огромное вам спасибо:)

trushka Сообщение 06/06/2012 23:45 Копия темы
Ну, я как раз имел в виду наоборот, думал, у вас так реализовано.. Просто скроллить же можно разными способами, и хорошо бы, чтоб со всеми работало без глюков, кроме того, насколько я знаю, Сафари вообще колёсико игнорирует.. поэтому, как раз целесообразно по-моему событие scroll() для основного блока использовать, хотя и тут может подглючивать.. На не очень мощных машинках при плавном скролле (тем же колёсиком) событие scroll() возникает не всё время, то есть "задние" слои будут двигаться рывками.. Даже если анимацию ставить, то тоже может быть заметна некая рассинхронизация и задержки – основной слой остановился, а остольные "догоняют".. Может, целесообразней таймер поставить, чтоб он каждые там 50 миллисекунд, например, проверял scrollTop основного блока и прри его изменении двигал остальные..

Но, опять же, основной посыл моего предыдущего коммента был в том, что  если box внутри .wrapper'a и вылазит за его "внутренние размеры", то он меняет и его scrollHeight и соответственно scrollTop может тоже меняться. Поэтому блок и не становится на своё место при движении назад. Просто надо тогда каколй-нибуть .inner-wrapper делать с overflow:hidden, а туда уже .box пихать

dr_sasha Сообщение 07/06/2012 14:26 Копия темы
Извините, что сразу не ответил, сегодня пол дня ребенком занимался. Дело в том, что эффект параллакса я начал изучать не так давно, а как таковой теории в интернете не так много и основная масса примеров построена именно на привязке события к window. Вы первый человек, который мне ответил, который уже сталкивался с параллаксом и в этом хорошо разбирается. В примерах из интернета я нигде не видел, чтобы кто-то применял mousewheel(), поэтому, можно сказать, что о этом методе узнал впервые от вас, за что очень благодарен. В книге, по которой изучал jQuery о этом тоже ни слова, sroll() был более-менее описан, а глубже копать автор не стал. Что касается моего примера, там есть свои нюансы. Есть несколько геометрических фигур, которые присутствуют на странице в единственном варианте, при прокрутки они должны  хаотично клонироваться за пределами окна в зависимости от направления прокрутки с разных сторон, должен создаться эффект бесконечности прокрутки, ну соответственно разные фигуры должны двигаться с разной скоростью, при этом никаких полос прокрутки не должно быть видно. Пока мучаю одну фигуру, но пока безрезультатно. Надеюсь, что сегодня сдвинусь с мертвой точки, нашел несколько сайтов с описанием mousewheel(), буду разбираться. Еще раз огромное вам спасибо за помощь.