读书人

jqmobile怎么使用flip效果(翻书效果)

发布时间: 2012-07-30 16:19:05 作者: rapoo

jqmobile如何使用flip效果(翻书效果)

插件下载:https://github.com/amegan/jquery-flip

1.下载插件后按照介绍流程引入js引用(保留jqmobile js的引用):

?12<link rel="stylesheet"href="css/jquery.mobile.flip.css"/><script type="text/javascript"src="js/jquery.mobile.flip.js"></script>

2.尝试最简单例子

?12345678910111213141516171819$(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,跑成功了~~~

读书人网 >移动开发

热点推荐