JavaScript 速度优化库：jTinder
jopen
9年前
jTinder 是一个能够让用户投票，图片加载变得快速和简单的JavaScript库。它是专门为移动触摸设备优化，但也有一个桌面备用。
在 HEAD 标签之前添加 CSS 文件：
<link rel="stylesheet" type="text/css" href="css/jTinder.css">
在 BODY 标签之前添加 JavaScript 包：
<!-- jQuery lib --> <script type="text/javascript" src="js/jquery.min.js"></script> <!-- transform2d lib --> <script type="text/javascript" src="js/jquery.transform2d.js"></script> <!-- hammer lib --> <script type="text/javascript" src="js/hammer.min.js"></script> <!-- jTinder lib --> <script type="text/javascript" src="js/jquery.jTinder.js"></script> <!-- jTinder initialization script --> <script>$("#tinderslide").jTinder();</script> 在 HTML 代码的 body 标签内加入 jTinder 内容：
<div id="tinderslide"> <ul> <li class="pane1"><div class="img"></div><div>Miami Beach</div><div class="like"></div><div class="dislike"></div></li> <li class="pane2"><div class="img"></div><div>San Francisco</div><div class="like"></div><div class="dislike"></div></li> <li class="pane3"><div class="img"></div><div>Chicago</div><div class="like"></div><div class="dislike"></div></li> <li class="pane4"><div class="img"></div><div>New York</div><div class="like"></div><div class="dislike"></div></li> <li class="pane5"><div class="img"></div><div>Beach</div><div class="like"></div><div class="dislike"></div></li> </ul> </div>