首页

关于

在线演示

如果你希望找到一款与众不同的jQuery幻灯插件的话,Fractionslider/ 肯定会让你眼前一亮,和传统幻灯不同的是,它可以让页面中的任何元素生成独立的动画效果。

使用非常简单,如下:

引入CSS和JS

  1. <link href="fractionslider.css" rel="stylesheet" />
  2. <script type="text/javascript" src="jquery-1.9.0.min.js"></script>
  3. <script type="text/javascript" src="jquery.fractionslider.js"></script>

HTML

  1. <div class="slider"><!-- your slider container -->
  2. <div class="slide"><!-- all elements for the first slide --></div>
  3. <div class="slide"><!-- all elements for the second slide --></div>
  4. <!-- and so on -->
  5. <div class="fs_loader"><!-- shows a loading .gif while the slider is getting ready --></div>
  6. </div>

需要动画效果的元素:

  1. <img alt="" src="path/to/image" data-position="100,100" />

调用插件:

  1. jQuery(window).load(function(){
  2. $('.slider').fractionSlider();
  3. });

下载地址:http://jacksbox.de/stuff/jquery-fractionslider/

留言

友情提示: 本站博客不再支持访客留言,如果有问题或者留言,请发布到  GBtags.com


  1. 烂番茄

    此评论在等待批准中

    2014-4-1 下午5:01

© Copywrite by gbin1.com, all rights reserved.