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 相关文章推荐
jQuery+CSS 实现的超Sexy下拉菜单
Jan 17 Javascript
精心挑选的15个jQuery下拉菜单制作教程
Jun 15 Javascript
js动态添加onload、onresize、onscroll事件(另类方法)
Dec 26 Javascript
javascript游戏开发之《三国志曹操传》零部件开发(二)人物行走的实现
Jan 23 Javascript
可选择和输入的下拉列表框示例
Nov 05 Javascript
Bootstrap入门教程一Hello Bootstrap初识
Mar 02 Javascript
微信小程序 实例开发总结
Apr 26 Javascript
解决vue-cli中stylus无法使用的问题方法
Jun 19 Javascript
JS中使用gulp实现压缩文件及浏览器热加载功能
Jul 12 Javascript
前端面试知识点目录一览
Apr 15 Javascript
JS co 函数库的含义和用法实例总结
Apr 08 Javascript
LayUI+Shiro实现动态菜单并记住菜单收展的示例
May 06 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
别人整理的服务器变量:$_SERVER
2006/10/20 PHP
MySQL授权问题总结
2007/05/06 PHP
PHP 基本语法格式
2009/12/15 PHP
php入门学习知识点四 PHP正则表达式基本应用
2011/07/14 PHP
第七章 php自定义函数实现代码
2011/12/30 PHP
Linux下PHP连接Oracle数据库
2014/08/20 PHP
php 解析xml 的四种方法详细介绍
2016/10/26 PHP
php中数组最简单的使用方法
2020/12/27 PHP
Javascript和Ajax中文乱码吐血版解决方案
2009/12/21 Javascript
JS滚轮事件onmousewheel使用介绍
2013/11/01 Javascript
原创jQuery弹出层插件分享
2015/04/02 Javascript
js+css实现超简洁的二级下拉菜单效果代码
2015/09/07 Javascript
轻松学习jQuery插件EasyUI EasyUI创建RSS Feed阅读器
2015/11/30 Javascript
BootStrap智能表单demo示例详解
2016/06/13 Javascript
prototype.js常用函数详解
2016/06/18 Javascript
如何解决hover在ie6中的兼容性问题
2016/12/15 Javascript
ThinkPHP+jquery实现“加载更多”功能代码
2017/03/11 Javascript
vue.js利用defineProperty实现数据的双向绑定
2017/04/28 Javascript
微信小程序之滚动视图容器的实现方法
2017/09/26 Javascript
微信小程序实现轨迹回放的示例代码
2019/12/13 Javascript
Javascript组合继承方法代码实例解析
2020/04/02 Javascript
jQuery实现简单轮播图效果
2020/12/27 jQuery
[46:47]2014 DOTA2国际邀请赛中国区预选赛 DT VS HGT
2014/05/22 DOTA
常见的python正则用法实例讲解
2016/06/21 Python
Python基于scapy实现修改IP发送请求的方法示例
2017/07/08 Python
Python tkinter实现的图片移动碰撞动画效果【附源码下载】
2018/01/04 Python
python设定并获取socket超时时间的方法
2019/01/12 Python
pandas DataFrame的修改方法(值、列、索引)
2019/08/02 Python
在python里使用await关键字来等另外一个协程的实例
2020/05/04 Python
Python3爬虫中Splash的知识总结
2020/07/10 Python
python实现计算图形面积
2021/02/22 Python
制定岗位职责的原则
2013/11/08 职场文书
幼儿教师思想汇报
2014/01/10 职场文书
教师党员个人总结
2015/02/10 职场文书
廉政承诺书2015
2015/04/28 职场文书
2021-4-3课程——SQL Server查询【2】
2021/04/05 SQL Server