插件下载:https://github.com/amegan/jquery-flip
1.下载插件后按照介绍流程引入js引用(保留jqmobile js的引用):
1
2
|
<link rel=
"stylesheet"
href=
"css/jquery.mobile.flip.css"
/>
<script type=
"text/javascript"
src=
"js/jquery.mobile.flip.js"
></script>
|
2.尝试最简单例子
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
|
$(document).ready(
function
() {
$(
"#flipRoot"
).flip({
forwardDir:
'ltor'
,
height:
'340px'
,
showpager:
true
,
loop:
true
}));
});
<div id=
"flipRoot"
data-role=
"flip"
data-flip-show-pager=
"true"
data-flip-forward-dir=
"ltor"
>
<div>
Flip Content 1
</div>
<p>
Flip Content 2
</p>
<section>
Flip Content 3
</section>
</div>
|
ok,跑成功了~~~