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 相关文章推荐
分享别人写的一个小型js框架
Aug 13 Javascript
JQuery调webservice实现邮箱验证(检测是否可用)
May 21 Javascript
Jquery实现的tab效果可以指定默认显示第几页
Oct 16 Javascript
Js参数值中含有单引号或双引号问题的解决方法
Nov 06 Javascript
自定义刻度jQuery进度条及插件
Sep 02 Javascript
Jquery效果大全之制作电脑健康体检得分特效附源码下载
Nov 02 Javascript
AngularJS递归指令实现Tree View效果示例
Nov 07 Javascript
浅谈angular2 组件的生命周期钩子
Aug 12 Javascript
Angular利用内容投射向组件输入ngForOf模板的方法
Mar 05 Javascript
使用vue-cli3新建一个项目并写好基本配置(推荐)
Apr 24 Javascript
简单实现节流函数和防抖函数过程解析
Oct 08 Javascript
深入了解Vue3模板编译原理
Nov 19 Vue.js
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
不重新编译PHP为php增加openssl模块的方法
2011/06/14 PHP
PHP 登录记住密码实现思路
2013/05/07 PHP
php获取数组长度的方法(有实例)
2013/10/27 PHP
PHP中常用的字符串格式化函数总结
2014/11/19 PHP
php 输出json及显示json中的中文汉字详解及实例
2016/11/09 PHP
php微信开发之自定义菜单实现
2016/11/18 PHP
一个对于js this关键字的问题
2007/01/09 Javascript
JS的递增/递减运算符和带操作的赋值运算符的等价式
2007/12/08 Javascript
jQuery最佳实践完整篇
2011/08/20 Javascript
javascript jq 弹出层实例
2013/08/25 Javascript
jquery实现清新实用的网页菜单效果
2015/08/28 Javascript
JavaScript深度复制(deep clone)的实现方法
2016/02/19 Javascript
jQuery实现checkbox全选功能完整实例
2018/07/12 jQuery
vue服务端渲染缓存应用详解
2018/09/12 Javascript
VUE渲染后端返回含有script标签的html字符串示例
2019/10/28 Javascript
ant design vue中表格指定格式渲染方式
2020/10/28 Javascript
[01:18]PWL开团时刻DAY4——圣剑与抢盾
2020/11/03 DOTA
[56:42]完美世界DOTA2联赛循环赛 Matador vs Forest 第二场 11.06
2020/11/06 DOTA
运用PyTorch动手搭建一个共享单车预测器
2019/08/06 Python
Python 将json序列化后的字符串转换成字典(推荐)
2020/01/06 Python
python shell命令行中import多层目录下的模块操作
2020/03/09 Python
python爬取”顶点小说网“《纯阳剑尊》的示例代码
2020/10/16 Python
使用CSS实现弹性视频html5案例实践
2012/12/26 HTML / CSS
基于HTML5陀螺仪实现ofo首页眼睛移动效果的示例
2017/07/31 HTML / CSS
英国第一独立滑雪板商店:The Snowboard Asylum
2020/01/16 全球购物
威盛公司软件C++工程师笔试题面试题
2012/07/16 面试题
一道Delphi面试题
2016/10/28 面试题
大专生工程监理求职信
2013/10/04 职场文书
护士长竞聘演讲稿
2014/04/30 职场文书
歌颂祖国的演讲稿
2014/05/04 职场文书
公司授权委托书范文
2014/08/02 职场文书
2015年法院工作总结范文
2015/04/28 职场文书
2015年反腐倡廉工作总结
2015/05/14 职场文书
教师节联欢会主持词
2015/07/04 职场文书
关于Vue中的options选项
2022/03/22 Vue.js
深入理解pytorch库的dockerfile
2022/06/10 Python