JQUERY教程

当前位置: HTML5技术网 > JQUERY教程 > 超棒的视差效果jQuery插件

超棒的视差效果jQuery插件

JQUERY教程  手机阅读


在线演示


         如果你希望找到一款与众不同的jQuery幻灯插件的话,Fractionslider/ 肯定会让你眼前一亮,和传统幻灯不同的是,它可以让页面中的任何元素生成独立的动画效果。
使用非常简单,如下:
引入CSS和JS
<link href="fractionslider.css" rel="stylesheet" /><script type="text/javascript" src="jquery-1.9.0.min.js"></script><script type="text/javascript" src="jquery.fractionslider.js"></script>
HTML
<div class="slider"><!-- your slider container -->  <div class="slide"><!-- all elements for the first slide --></div>  <div class="slide"><!-- all elements for the second slide --></div>  <!-- and so on -->  <div class="fs_loader"><!-- shows a loading .gif while the slider is getting ready --></div></div>
需要动画效果的元素:
<img alt="" src="path/to/image" data-position="100,100" />
调用插件
jQuery(window).load(function(){  $('.slider').fractionSlider();});
下载地址:http://jacksbox.de/stuff/jquery-fractionslider/

【超棒的视差效果jQuery插件】相关文章

1. 超棒的视差效果jQuery插件

2. 超棒的视差效果jQuery插件

3. Parallax.js:自适应智能设备方向的视差效果插件

4. 另外一款超棒的响应式布局jQuery插件 - Freetile.js

5. 分享13款最新的超棒jQuery插件

6. 7 个超棒的HTML5交互性网站

7. 使用浏览器生成超棒的midi音乐 - midi.js

8. 超棒的前端开发界面套件 - InK

9. 分享一款页面视差滚动切换jquery.localscroll插件

10. 10个很棒的 jQuery 插件和制作教程

本文来源:https://www.51html5.com/a1261.html

点击展开全部
上一篇:Jquery Mobile html5 phonegap中 js 跨域请求数据 实现增删查 下一篇:利用HTML5与jQuery技术创建一个简单的自动表单完成

﹝超棒的视差效果jQuery插件﹞相关内容

「超棒的视差效果jQuery插件」相关专题

jquery jquery动画
复制网址 收藏网址 分享到微信 分享到微博 分享到QQ

其它栏目

HTML5教程 CSS3教程 JQUERY教程

也许您还喜欢