都知道jquery都插件是非常强大的,最近分享点jquery插件效果,方便效果开发使用. 一.HTML代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml&quo…
这个插件非常好用 http://www.swiper.com.cn/…
源码如下: $.fn.pager = function (pagerInfo) { var recordCount = this.size(); if (recordCount <= pagerInfo.pagesize) return; var currentPageIndex = 1, //当前面,默认为1 pageCount = Math.ceil(recordCount / pagerInfo.pagesize); //总页数 //构建分页的html $('<div>一共' + …
移动端触摸滑动插件Swiper 04/02/2015 一.了解Swiper 目前移动端项目一般都需要具有触屏焦点图的效果,如果你也需要实现这一功能的话,Swiper是一个不错的选择. 1.他不需要加载任何公共库(如jQuery)即可运行,这保证了Swiper的轻量和运行速度.Swiper也可以在加载了公共库的环境下安全的动行,如jQuery,Zepto,jQuery Moblie等. 2.Swiper默认的触摸比例为1:1,你可以通过修改Swiper的设置来改变这个比例. 3.Swiper 增加…
1.效果及功能说明 animate动画分页按钮制作鼠标悬停分页按钮上滑动展开分页按钮,鼠标离开后分页按钮收缩 2.实现原理 主要是靠动画方法,来让原本的箭头图像的长度发生变长,正好可以融入下标题的文字大小,当鼠标离开以后就会让箭头图像触发另一个动画效果让让标题消失和长度变回原来的大小. 主要的方法 $(this).animate({width:90},400,function(){ //定义当前动画让长度通过动画变成90长度在0.4秒完成 $(this).children(".title&quo…
有时我们需要做一个单页面介绍产品特性,而单页面内容非常多且页面非常长,为了快速定位到产品特性节点,我们使用js侦听用户滚轮事件,当用户触发滚轮滑动或者使用手势触屏滑动时,即可定位到相应的节点.一款jQuery插件叫Scrollify帮我们做到了. Scrollify需要jQuery 1.6+以及缓冲动画easing插件配合来实现.HTML基本结构如下: <!DOCTYPE HTML> <html> <head> <meta charset="utf-8&…
bxSlider特性 1.充分响应各种设备,适应各种屏幕: 2.支持多种滑动模式,水平.垂直以及淡入淡出效果: 3.支持图片.视频以及任意html内容: 4.支持触摸滑动: 5.支持Firefox,Chrome,Safari,iOS,Android,IE7+ 官方网站:http://bxslider.com/ 中文说明可参考:http://www.helloweba.com/view-blog-219.html 如何使用bxSlider 1.首先是加载jQuery库,以及bxSlider插件文件…
Wow Slider  WOW Slider是一款小巧易用的网页滑块设计.该软件内置大量的模版和工具,让你轻松设计出完美的视觉效果.他还可以帮助用户在短时间内创造出梦幻般的滑块,而无需编码和图像编辑,是很不错的图像滑块设计工具. Nivo Slider Nivo Slider是一款出色的jQuery幻灯片插件,支持多种切换效果,可定制性强. Simple Multi-Item Slider 一款基于jQuery插件的多项目滚动条,Simple Multi-Item Slider Category…
动态创建jQuery插件 一.实现功能: 1.基本功能:自适应式整屏分页功能的实现 2.通过鼠标点击标签页转换分页,支持键盘上下左右键的转换分页,同样支持 鼠标滚轮上下滑动转换分页 3.切屏时的动画效果 4.jQuery实现简单的组件开发 5.本文创建的组件直接绑定在$.fn上,可以在Dom调用 二.主要实现代码 1.创建的分页的默认配置,用户可以修改其内容,来实现不同的内容 ``` $.fn.PageSwitch.defaults = { selectors: { //可以修改页面上的各块的c…
1.客户端的jQuery 分页插件jPages jPages 是一个客户端的分页插件,但提供很多特性例如自动翻页.键盘和滚动浏览,延迟显示以及完全可定制的导航面板. Read More Demo 2. jQuery ScrollPagination jQuery ScrollPagination plugin 是一个 jQuery 实现的支持无限滚动加载数据的插件. Read More Demo 3. jQuery 的分页插件——jqPagination jqPagination 是一个简单易用…