zoukankan      html  css  js  c++  java
  • jquery.cycle实现有导航的幻灯片效果

    jquery.cycle是个很好用的幻灯片插件

    http://jquery.malsup.com/cycle/

    但在官方的例子中却没有数字导航的例子,可能大部分人会认为它并不支持数字导航,今天刚好需要实现数字导航幻灯片效果,所以下载了个jquery.cycle看一下源代码,发现有个相关参数:

    pager:   null,  // selector for element to use as pager container

    之后我修改例子实验了一次

    <script type="text/javascript">
    $(document).ready(function() {
        $('.slideshow').cycle({
    		pager: '#pager',
    		fx: 'fade' // choose your transition type, ex: fade, scrollUp, shuffle, etc...
    	});
    });
    </script>
    <div id="pager"></div>
    

    之后id=pager的DIV就会出现数字导航,十分方便!

    PS: 现在最新版是2.94,但这个版本的pager功能有问题,我所使用的版本是2.74

  • 相关阅读:
    Scrapy中间件
    Scrapy简介
    Scrapy解析器xpath
    postman
    yarn
    brew 安装 yarn 时候失败
    immutability-helper 用途+使用方法
    js 正则
    react redux 应用链接
    react 事件传参数
  • 原文地址:https://www.cnblogs.com/catcat811/p/1930225.html
Copyright © 2011-2022 走看看