Как реализовать эффект многоадресной прокрутки? - PullRequest
0 голосов
/ 25 января 2012

У меня есть массив div, которые по размерам больше, чем его контейнер (родитель). У меня есть переполнение, скрытое в контейнере, и я вызываю JQuery Overscroll на карте, чтобы придать ему ощущение iPhone http://www.azoffdesign.com/overscroll.

У меня возникла проблема, связанная с реализацией стрелки отслеживания, когда пользователь прокручивает массив, а центр div (home) выходит за пределы поля зрения. Когда пользователь прокручивает «домой» из поля зрения в область переполнения, я бы хотел, чтобы стрелка появлялась на внутреннем краю контейнера и следовала за ним по краю, где бы он ни находился вне поля зрения. Для меня имеет смысл использовать изображение для стрелки, а затем повернуть его так, чтобы оно указывало в правильном направлении при перемещении «дома».

Вот моя скрипка с базовой работой> http://jsfiddle.net/virtuapete/QVQ5r/1/

Таким образом, есть 3 элемента, чтобы заставить его работать должным образом ... изображение, следующее за "домом", перемещается в переполнении, повороте изображения относительно того, где находится дом (поэтому стрелка всегда указывает на "дом" "и затем просто прячешь стрелку, как только дом становится видимым внутри контейнера.

Я почти уверен, что уже видел этот эффект раньше, и, чтобы начать решать проблему, я начал искать методы прокрутки, поскольку это было бы близким одномерным примером этой концепции. Вроде как многоплановая прокрутка следуют почти. Я дошел до того, что теперь полностью запутался, и у меня недостаточно сил, чтобы смешивать фрагменты кода различий, которые я нашел в желаемом результате!

Я нашел jsfiddle (http://jsfiddle.net/hj57k) чего-то, что могло бы быть в соответствии с тем, что я хочу, без div, следующего за объектом (в этом примере - курсором), как только он покинул границы контейнера. Любая помощь была бы удивительной, потому что я просто застрял в том, как начать ... получить div, чтобы следить за объектом по сторонам, было бы отличным началом, и я, вероятно, мог бы взять его оттуда ...

Ответы [ 2 ]

1 голос
/ 15 мая 2017

Здесь обновлена ​​скрипка для многонаправленной прокрутки.Просто добавьте четырехстрочный javascript, такой как

$(".container").overscroll({
    direction: 'auto'
}); 

Jsfiddle Demo

1 голос
/ 26 января 2012
...