• jQuery Cycle Plugin的使用


    jQuery幻灯片效果或者Slideshow效果当中如果不考虑touch效果的话,jQuery Cycle插件实在是太强大了,各种高大上的动画效果,如果想加上touch效果可以结合本blog介绍的wipetouch插件一起使用,用起来也非常简单

    使用起来非常简单

                    <div id="zoom">
                        <img src="/images/s1.jpg"/>
                        <img src="/images/s2.jpg"/>
                        <img src="/images/s3.jpg"/>
                        <img src="/images/s4.jpg"/>
                    </div>
    <script type="text/javascript" src="/js/jquery-1.8.3.min.js"></script>
    <script type="text/javascript" src="/js/jquery.cycle.all.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $("#zoom").cycle({
                fx: 'wipe',//切换动作特效选择,还可以选择特效 blindX blindY blindZ cover curtainX curtainY fade fadeZoom growX growY scrollUp scrollDown scrollLeft scrollRight scrollHorz scrollVert shuffle slideX slideY toss turnUp turnDown turnLeft turnRight uncover wipe zoom等等
                speed: 1000,//切换速度
                timeout: 6000,//切换完之后的停留时间
                clip: 'zoom'//'clip' option: 'l2r': left-to-right , 'r2l': right-to-left , 't2b': top-to-bottom ,'b2t': bottom-to-top ,'zoom': center-to-edges        });
        });
    </script>

    懂英文的可以到官网上了解更多 http://malsup.com/jquery/cycle/
    移动互联网时代,还有功能更加强大的cycle2也出来了,了解更多 http://malsup.com/jquery/cycle2/

  • 相关阅读:
    接口测试总结
    Jmeter教程索引贴
    [转] 配置Log4j
    Jmeter报告优化之New XSL stylesheet
    Jmeter默认报告优化
    iOS 自动移除KVO观察者
    iPhone X 适配 ( iOS 11适配 )
    iOS中自动登录的设计
    iOS APP 安全测试
    APP安全测评checklist---Android
  • 原文地址:https://www.cnblogs.com/fastmover/p/4193189.html
Copyright © 2020-2023  润新知