zoukankan      html  css  js  c++  java
  • jQuery图片轮播插件:jqFancyTransitions

    又发现了一款不错的图片轮播插件,图片的切换效果还是很不错的,大家可以点击下面的链接预览:
    http://www.iawen.com/Demo/jqFancyTransitions/demo.html

    具体的使用方法,大家可以去插件的主要查看.
    主页是:http://www.workshop.rs/projects/jqfancytransitions

    这里简单的说明一下:
    首先是包含脚本:

    <script type="text/javascript" src="jquery-1.5.2.min.js"></script> 
    <script type="text/javascript" src="jqFancyTransitions.1.8.min.js"></script> 
    

    其次是编写HTML代码:

    <div id='slideshowHolder'>
        <img src='1_b.jpg' alt='img1' />
        <img src='2_b.jpg' alt='img2' />
        <img src='3_b.jpg' alt='img3' />
        <img src='4_b.jpg' alt='img4' />
      </div>

    最后就是调用了:

    <script type="text/javascript">
        $(function(){
          $('#slideshowHolder').jqFancyTransitions({
            effect: '', // wave, zipper, curtain
             500, // width of panel
            height: 332, // height of panel
            strips: 20, // number of strips
            delay: 5000, // delay between images in ms
            stripDelay: 50, // delay beetwen strips in ms
            //titleOpacity: 0.7, // opacity of title
            //titleSpeed: 1000, // speed of title appereance in ms
            position: 'alternate', // top, bottom, alternate, curtain
            direction: 'fountainAlternate', // left, right, alternate, random, fountain, fountainAlternate
            navigation: true, // prev and next navigation buttons
            //links: false // show images as links
          });
        });
      </script>




  • 相关阅读:
    unittest生成html测试报告
    excel类封装
    023-linux(2)
    016-WebDriver API(2)
    015-WebDriver API
    014-unittest扩展
    013- unittest单元测试框架
    011-python列表,元组,字典的用法
    010-利用Selenium+python自动输入博客账号密码登录
    009-python一些问题整理
  • 原文地址:https://www.cnblogs.com/coxsoft/p/2422398.html
Copyright © 2011-2022 走看看