jQuery Mobile — применение эффектов перехода для отдельных элементов dom

Я хочу сделать что-то подобное с помощью jQuery Mobile (и в идеале без дополнительных плагинов): http://demo.tutorialzine.com/2010/03/sponsor-wall-flip-jquery-css/demo.php

Я могу заставить его работать только с одним элементом, используя страницы и «data-rel=dialog».. но это становится довольно сложно с несколькими элементами.

Мне было интересно, есть ли способ просто вызвать переход «flip» без использования атрибута data-role=page. Другими словами, просто переверните любой обычный div.

Возможно ли что-то подобное?


transition jquery flip jquery-mobile
person Joseph Wer    schedule 31.08.2011    source источник

Ответы (2)


arrow_upward
1
arrow_downward

Итак, вам просто нужен элемент на одной из ваших страниц, который можно переворачивать, как отдельные логотипы на перекидной стене? Вы абсолютно можете это сделать. Это (предположим здесь, поскольку я не рассматривал это подробно) анимация CSS. Однако они поддерживаются не во всех браузерах (в основном только в браузерах на основе webkit, но это ваши основные мобильные устройства, Mac и ПК-энтузиасты).

Прочтите эту статью из The Art of Web:

http://www.the-art-of-web.com/css/3d-transforms/

Это должно привести вас на путь туда, где вы хотите быть.

person Joe Bedurndurn    schedule 31.08.2011
comment
Спасибо, сэр! Я подумал, что в этом есть что-то совершенно очевидное. Учитывая, что мое приложение предназначено только для iPad, 3D-преобразования css будут работать отлично. - person Joseph Wer; 01.09.2011

arrow_upward
0
arrow_downward

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

$(element).addClass("flip"); // to flip it
$(element).removeClass("flip"); // after the animation is complete
person Tigertron    schedule 26.10.2013