Перелистывание жестом...

[Kod.Begemot]

А как бы реализовать перелистывание страниц как тут:
http://m.rp5.ru/%D0%9F%D0%BE%D0%B3%D0%B ... 0%B0%D0%B9
реально?

[Amarok]

Так и нет ответа?

[Kod.Begemot]

Да нету... А у меня опыта и знаний на такое не хватает.

[ILGAS]

А как бы реализовать перелистывание страниц как тут:
http://m.rp5.ru/%D0%9F%D0%BE%D0%B3%D0%B ... 0%B0%D0%B9
реально?

Всем привет, за такой длительный период времен кто то смог сделать перелистывание страниц?

[Akorolev]

Да насчет листалки - тема интересная, гляну на досуге.

[Akorolev]

Собственно по свайпу, получилось, но только перелистывает на активных областях, можно конечно сделать на всем попробовать )

[Akorolev]

Распишу да оставлю памятку для себя.
Сразу скажу что штука эта бесполезная, так как работает по определенному контейнеру, собственно двигать элементы можно только по данному контейнеру.
Попробую объяснить, есть пол, на полу стоит стул, нам что то нужно сдвинуть что бы куда то перейти ))). И так, в качестве контейнера выступает пол, соответственно если сдвинем пол то перейдем, а если сдвинем стул то никуда не перейдем.
Если сделать стул контейнером, то по сдвигу стула перейдем, а по полу нет... В общем как то так, бред, но как могу так и объясняю.

Что мы имеем:
1. Плагин: http://labs.rampinteractive.co.uk/touch ... index.html
2. Нашу сцену. Сцены я импортировал уже готовые с форума.

Я сильно разбираться не стал и сделал на скорую руку.
Заходим в сцену, я использовал вот этот блок, т.к. он самый верхний:


Заходим в его редактирование и вставляем код:

Код: Выделить всё

<script type="text/javascript" src="http://labs.rampinteractive.co.uk/touchSwipe/jquery.touchSwipe.min.js"></script>
<script>
 $(function() {      
      //указываем id контейнера
      $("#scene_wallpaper_4").swipe( {
        //перелистываем влево
        swipeLeft:function(event, direction, distance, duration, fingerCount, fingerData) {
          document.location.href = "/popup/scenes/5.html";  
        },
        // перелистываем вниз
        swipeDown:function(event, direction, distance, duration, fingerCount, fingerData) {
          document.location.href = "/popup/scenes/3.html";  
        },
         threshold:0
      });
    });
</script>

Теперь по коду:
#scene_wallpaper_4 - это ID нашего контейнера, определяется простым способом, инспектированием элемента:

У меня он выбран в качестве фона.
swipeLeft:function - данная функция задействувается при перелистывании в лево, у меня на ней стоит переход на страницу с определенной сценой: /popup/scenes/5.html
swipeLeft:function - функция при перелистывании в право, у меня ее нет.
swipeTop:function - функция при перелистывании в верх, тоже не использовал.
swipeDown - при перелистывании в низ, у меня там идет тоже переход на определенную сцену. /popup/scenes/3.html
Собственно как то так, код костыльный, сильно не углублялся.

[Kod.Begemot]

Но ведь мы можем это применить к нескольким объектам, так? Тогда и сдвигается будет при почти любом свайпе?
И ещё, мне кажется есть ещё возможности, к примеру можно такой сдвиг использовать на изображении графика, чтобы сместить диапазон отображения... Наверное

[Akorolev]

Но ведь мы можем это применить к нескольким объектам, так? Тогда и сдвигается будет при почти любом свайпе?

Сколько тут кода появится ))) В принципе если не ошибаюсь есть у JS определение всех div, тогда думаю можно.

И ещё, мне кажется есть ещё возможности, к примеру можно такой сдвиг использовать на изображении графика, чтобы сместить диапазон отображения... Наверное

На изображении без проблем, но я использую везде в сценах графики модуля charts.
По сути ничего сложного то и нету, вникать надо )

[Akorolev]

По графикам вот так использую: