bsc-slider是一款带17种内置过渡动画的jquery轮播图插件。该jquery轮播图插件可以制作最基本的轮播图效果,并内置17种过渡动画效果,还可以自定义动画的easing效果。

使用方法

在页面中引入jquery和jquery.bscslider.js和jquery.bscslider.css文件。如果需要自定义easing效果,还需要引入jquery.easing.js文件。

HTML结构

该jquery轮播图的HTML结构采用

嵌套图片的方式:

初始化插件

在页面DOM元素加载完毕之后,通过bscSlider()方法来对轮播图进行初始化。

$('.slider').bscSlider();

配置参数

该jquery轮播图的可用配置参数如下:

// 默认值

$('.slider').bscSlider({

autoplay : true,

navigation : false,

duration : 6000,

effect : 1,

effect_speed : 750,

easing : 'swing',

height : 300

});

autoplay:轮播图是否自动播放。

navigation:轮播图是否显示前后导航按钮。

duration:轮播图图片切换的间隔时间,单位毫秒。

effect:内置的过渡动画效果,可选值为1-17。

effect_speed:过渡动画的速度,单位毫秒。

easing:easing动画函数。

height:指定轮播图的高度。

动漫轮播html,带17种内置过渡动画的jquery轮播图插件相关推荐

  1. jsp内置对象【02】四种内置对象【02】session、application

    我们继续来学习,上一篇文章中说到了request属性,那么既要想客户端和服务端都都能实现跳转的话,就用到了session. 第三种:session属性 我们接着修改一下上一篇文章中的代码来对比一下: ...

  2. 架构师成长记_第八周_10_ES-分词与五种内置分词器

    文章目录 ES-分词 PS: 1. 全局分析方式(_analyze) 2. 指定字段分析方式(索引名/_analyze) ES-五种内置分词器介绍 1 标准分词器 standard 2 非字母分词器 ...

  3. JS-内置对象内置构造函数事件-拖拽轮播图无缝滚动

    内置对象&内置构造函数 日期时间格式 // 创建一个当前时刻的日期时间对象 var date = new Date(); // 获取date对象中的年月日时分秒 var y = date.ge ...

  4. python自带笔记本电脑_Python内置常用模块

    time和datatime Range os sys hashlib XML json & picle 1.time和datetime time和datetime都是python处理时间和日期 ...

  5. php内置类,yii2学习教程之5种内置行为类详解

    前言 众所周知学习所有知识都需要循序渐进,行为也是一样,在我们学会很牛逼的新建行为,然后轻松注入到组件类之前,先看看yii2框架为我们准备的5个内置的行为类,也许你刚要用到~话不多说了,来一起看看详细 ...

  6. Python基础必掌握的5种数据类型和8种内置函数基本操作

    今天跟着我一起学习/复习一下Python语法的5种基本数据类型和8种数据基本操作.如果你已经掌握了这块内容,也建议跟着文中代码进行操作加深印象巩固学习成果. 整套学习自学教程中应用的数据都是<三 ...

  7. python有几种容器_Python中几种内置的容器(Containers)类型:列表、字典、集合和元组的比较和该注意的点...

    之所以称他们为容器类型是因为他们不像基本类型那样只有一种简单类型的数据,而是可以包含其他类型的数据,numpy的计算速度比原生Python快的一个很重要的原因就是numpy中的数组(类似于Python ...

  8. python的四种内置数字类型_浅析Python数字类型和字符串类型的内置方法

    一.数字类型内置方法 1.1 整型的内置方法 作用 描述年龄.号码.id号 定义方式 x = 10 x = int('10') x = int(10.1) x = int('10.1') # 报错 内 ...

  9. java 自带观察者模式_java 内置的观察者模式

    1.可观察的对象 public class PurchaseDate extends Observable { private int Id; private String orderNumber; ...

最新文章

  1. pandas 中 的drop函数
  2. 修改值类型的实例方法 mutating
  3. python2中使用中文报错:SyntaxError: Non-ASCII character
  4. Asp.Net数据库编程-10条最优方法[翻译]
  5. 游戏CFHD,狙可不是随便就起的,狙击的作用是辅助
  6. 每日总结-2016年3月9日
  7. 在JSP页面中使用Ajax主题时的引入
  8. 2_3 ProxyMode.cpp 代理模式
  9. Android开发之设置DialogFragment的窗体背景色的方法亲测可用
  10. bat中的start
  11. Atitit 翻页功能的解决方案与版本历史 v4 r49
  12. 前端 img 标签显示 base64 格式的 图片
  13. Ubuntu20.04 安装CUDA驱动和一些系统配置
  14. 图中奇度点的数量不可能有奇数个的证明
  15. word文档css格式化,CSS的Word中的列表详解
  16. 台式计算机对比评测报告,高效稳定的办公之选-宏碁商祺X4270评测报告
  17. Vant IndexBar 在小程序中的简单使用
  18. 离DApp的爆发还差什么?|链捕手
  19. 机器视觉入门资料大全,工业机器人“眼睛”
  20. 20181103 Nginx(布尔教育)

热门文章

  1. 【UI自动化】给好友发大批量图片
  2. 注水问题(最多接水)
  3. 利用tensorflow的image_retrain实现再训练和分类识别
  4. 论文翻译:How to Retrain Recommender System A Sequential Meta-Learning Method
  5. Photon PUN和Photon Server连接问题及解决方法(Unity开发)
  6. camunda 驳回 二 并行
  7. 在雅加达EE服务中使用Thymeleaf
  8. 中美人工智能技术差距太大 不可急着商业化
  9. python_库学习_02_微信自动回复机器人
  10. 基于DVWA文件上传,包含漏洞,上传一句话木马基础分析