轮播插件unsilder 源码解析(一)---使用
啰嗦几句:学习的可以直接省略,一直本着写原生的插件想法,但是前天看了吕大豹的博客觉得自己都没有正经的写个jquery插件;所以在开始写之前我会先对几个比较热门的jquery的插件进行源码分析;至于为什么第一遍就选了unslider的原因主要的是今年二月份的时候我在找工作的时候我在自己写各种雷同的html,网站复制,当时就选了我们大杭电的官网的轮播,其插件用的就是unsilder,所以今天在想要以什么插件开头,当然就以unslider开始;
好了开始了
首先怎么使用它
Document
.unslider {
overflow: auto;
margin: 0;
padding: 0
}
.unslider-wrap {
position: relative
}
.unslider-wrap.unslider-carousel li {
float: left
}
.unslider-vertical > ul {
height: 100%
}
.unslider-vertical li {
float: none;
width: 100%
}
.unslider-fade {
position: relative
}
.unslider-fade .unslider-wrap li {
position: absolute;
left: 0;
top: 0;
right: 0;
z-index: 8
}
.unslider-fade .unslider-wrap li.unslider-active {
z-index: 10
}
.unslider li, .unslider ol, .unslider ul {
list-style: none;
margin: 0;
padding: 0;
border: none
}
.unslider-arrow {
position: absolute;
left: 20px;
z-index: 2;
cursor: pointer
}
.unslider-arrow.next {
left: auto;
right: 20px
}
- Slide 1
- Slide 2
- Slide 3
- Slide 4
//
轮播插件unsilder 源码解析(一)---使用的更多相关文章
- 轮播插件unsilder 源码解析(一)---源码解析
jq扩展内容 $.fn.unslider = function(opts) { return this.each(function(index,elem) { var $this = $(elem); ...
- 轮播插件unsilder 源码解析(二)
$.fn._active = function(className) { //当前的添加class,相邻元素去除class return this.addClass(className).siblin ...
- 3D轮播切换特效 源码
这个3D轮播切换特效是我2017年2月份写的 当初我 刚接触HTML不久,现在把源码分享给大家 源码的注释超级清楚 . <!-- 声明文档类型:html 作用:符合w3c统一标准规范 每个浏览器 ...
- Android 热修复Nuwa的原理及Gradle插件源码解析
现在,热修复的具体实现方案开源的也有很多,原理也大同小异,本篇文章以Nuwa为例,深入剖析. Nuwa的github地址 https://github.com/jasonross/Nuwa 以及用于 ...
- Ocelot简易教程(七)之配置文件数据库存储插件源码解析
作者:依乐祝 原文地址:https://www.cnblogs.com/yilezhu/p/9852711.html 上篇文章给大家分享了如何集成我写的一个Ocelot扩展插件把Ocelot的配置存储 ...
- Android 全面插件化 RePlugin 流程与源码解析
转自 Android 全面插件化 RePlugin 流程与源码解析 RePlugin,360开源的全面插件化框架,按照官网说的,其目的是“尽可能多的让模块变成插件”,并在很稳定的前提下,尽可能像开发普 ...
- Maven 依赖调解源码解析(二):如何调试 Maven 源码和插件源码
本文是系列文章<Maven 源码解析:依赖调解是如何实现的?>第二篇,主要介绍如何调试 Maven 源码和插件源码.系列文章总目录参见:https://www.cnblogs.com/xi ...
- 原生JS实现"旋转木马"效果的图片轮播插件
一.写在最前面 最近都忙一些杂七杂八的事情,复习软考.研读经典...好像都好久没写过博客了... 我自己写过三个图片轮播,一个是简单的原生JS实现的,没有什么动画效果的,一个是结合JQuery实现的, ...
- Nivo Slider - 世界上最棒的 jQuery 图片轮播插件
Nivo Slider 号称世界上最棒的图片轮播插件,有独立的 jQuery 插件和 WordPress 插件两个版本.目前下载量已经突破 1,800,000 次!jQuery 独立版本的插件主要有如 ...
随机推荐
- PHPmailer关于Extension missing: openssl报错的解决
最近在写一个网页的时候,需要用到PHPmailer来发送邮件,按照官网上给出的demo写出一个例子,却报错Extension missing: openssl 最后发现需要修改php.ini中的配置: ...
- SQL Server 2012 新特性:新增和修改函数
转换函数 1.PARSE Parse是把字符串类型转化为想要的类型,看看和convert和cast的区别 SELECT PARSE ('2.111111' AS f ...
- Hive安装(二)之表不见了
重启一下电脑,发现表不见了,原来我用的derby存储hive的meta,网上找了一下资料,说是要用mysql, 于是安装mysql sudo apt-get install mysql-serve ...
- WPF 自定义DateControl DateTime控件
自定义日期控件,月份选择.如下是日期的一些效果图. 具体的样式.颜色可以根据下面的代码,自己调节即可 1.日期控件的界面 <UserControl x:Class="WpfApp ...
- Android Studio NDK 开发 问题记录
Android NDK 开发 问题解决 编译:找不到gles3库 使用旧的编译方式,写Android.mk 进行编译.报错如下 gles3/gl3.h no such file or director ...
- sqlserver 连接不同服务器,不同实例
SELECT *FROM OPENDATASOURCE( 'SQLOLEDB', 'Data Source=ServerName;User ID=MyUID;Pas ...
- 第9章 Shell基础(4)_Bash的运算符及环境变量配置文件
5. Bash的运算符 5.1 数值运算与运算符 5.1.1 declare 声明变量类型:#declare [+/-] [选项] 变量名 选项 说明 - 给变量设定类型属性 + 取消变量的类型属性 ...
- Linux中C程序调试、makefile
gcc基本语法格式:gcc [-选项] 源文件 [-选项] 目标文件,GCC编译C程序的过程: 预处理:gcc -E hello.c hello.i.-E指定执行到预处理结束,下面类似. 编译:gcc ...
- [LeetCode] Wiggle Sort 摆动排序
Given an unsorted array nums, reorder it in-place such that nums[0] <= nums[1] >= nums[2] < ...
- JQuery Ajax调用asp.net后台方法
利用JQuery的$.ajax()可以很方便的调用asp.net的后台方法. 先来个简单的实例热热身吧. 1.无参数的方法调用 asp.net code: using System.Web.Scrip ...