jquery实现带缩略图的全屏图片画廊效果实例


Posted in Javascript onJune 25, 2015

本文实例讲述了jquery实现带缩略图的全屏图片画廊效果。分享给大家供大家参考。具体如下:

运行效果如下图所示:

jquery实现带缩略图的全屏图片画廊效果实例

主要代码如下:

(function($) {
$.fn.preload = function(options) {
  var opts = $.extend({}, $.fn.preload.defaults, options);
  o   = $.meta ? $.extend({}, opts, this.data()) : opts;
  var c  = this.length,
   l  = 0;
  return this.each(function() {
   var $i = $(this);
   $('<img/>').load(function(i){
    ++l;
    if(l == c) o.onComplete();
   }).attr('src',$i.attr('src')); 
  });
 };
 $.fn.preload.defaults = {
  onComplete : function(){return false;}
 };
})(jQuery);

完整实例代码点击此处本站下载。

希望本文所述对大家的jquery程序设计有所帮助。

Javascript 相关文章推荐
点击A元素触发B元素的事件在IE8下会识别成A元素
Sep 04 Javascript
js实现的捐赠管理完整实例
Jan 20 Javascript
浅谈Node.js中的定时器
Jun 18 Javascript
全面了解构造函数继承关键apply call
Jul 26 Javascript
关于js的三种使用方式(行内js、内部js、外部js)的程序代码
May 05 Javascript
vue内置组件transition简单原理图文详解(小结)
Jul 12 Javascript
vue.js 实现评价五角星组件的实例代码
Aug 13 Javascript
JS/HTML5游戏常用算法之碰撞检测 包围盒检测算法详解【矩形情况】
Dec 13 Javascript
详解React中合并单元格的正确写法
Jan 08 Javascript
详解关于html,css,js三者的加载顺序问题
Apr 10 Javascript
layui弹出框Tab选项卡的示例代码
Sep 04 Javascript
JS前端使用Canvas快速实现手势解锁特效
Sep 23 Javascript
javascript实现跨域的方法汇总
Jun 25 #Javascript
浅谈JavaScript字符串拼接
Jun 25 #Javascript
javascript最基本的函数汇总
Jun 25 #Javascript
使用javascript将时间转换成今天,昨天,前天等格式
Jun 25 #Javascript
javascript中的Function.prototye.bind
Jun 25 #Javascript
jQuery实现为图片添加镜头放大效果的方法
Jun 25 #Javascript
jquery实现的缩略图预览滑块实例
Jun 25 #Javascript
You might like
如何开始收听短波广播
2021/03/01 无线电
jQuery+PHP+ajax实现微博加载更多内容列表功能
2014/06/27 PHP
PHP实现自动发送邮件功能代码(qq 邮箱)
2017/08/18 PHP
javascript对中文按照拼音排序代码
2014/08/20 Javascript
分享9个最好用的JavaScript开发工具和代码编辑器
2015/03/24 Javascript
JavaScript中Number.NEGATIVE_INFINITY值的使用详解
2015/06/05 Javascript
asp知识整理笔记3(问答模式)
2015/09/27 Javascript
jquery实现左右无缝轮播图
2020/07/31 Javascript
实例讲解JavaScript中instanceof运算符的用法
2016/06/08 Javascript
js接收并转化Java中的数组对象的方法
2016/08/11 Javascript
js实现模糊匹配功能
2017/02/15 Javascript
JS简单实现滑动加载数据的方法示例
2017/10/18 Javascript
vue.js的computed,filter,get,set的用法及区别详解
2018/03/08 Javascript
微信小程序scroll-view仿拼多多横向滑动滚动条
2020/04/21 Javascript
Promise.all中对于reject的处理方法
2018/08/01 Javascript
PYTHON基础-时间日期处理小结
2018/05/05 Python
Pycharm+Scrapy安装并且初始化项目的方法
2019/01/15 Python
python去重,一个由dict组成的list的去重示例
2019/01/21 Python
Python enumerate函数功能与用法示例
2019/03/01 Python
pyqt5中QThread在使用时出现重复emit的实例
2019/06/21 Python
Python列表切片常用操作实例解析
2019/12/16 Python
CSS3实现水平居中、垂直居中、水平垂直居中的实例代码
2020/02/27 HTML / CSS
LightInTheBox西班牙站点:全球商品在线采购
2016/09/22 全球购物
办公室文书岗位职责
2013/12/16 职场文书
酒店中秋节促销方案
2014/01/30 职场文书
幼儿园中班教学反思
2014/02/10 职场文书
《盘古开天地》教学反思
2014/02/28 职场文书
合伙经营协议书
2014/04/18 职场文书
农村党支部书记四风问题个人对照检查材料
2014/09/21 职场文书
单位工作证明
2014/10/07 职场文书
新郎接新娘保证书
2015/05/08 职场文书
个人催款函范文
2015/06/23 职场文书
2019年英语版感谢信(8篇)
2019/09/29 职场文书
使用react+redux实现计数器功能及遇到问题
2021/06/02 Javascript
如何使用Tkinter进行窗口的管理与设置
2021/06/30 Python
Python语言内置数据类型
2022/02/24 Python