js代码_js特效免费下载_JS特效代码网   网页特效   鼠标特效   js图片相册   js特效代码大全
当前位置:首页 > 网页特效 > JS常用代码 > 图片相册

jQuery动态加载图片相册,弹窗大图特效

发布时间:2015-08-29 21:57:00    您是第0位浏览者

本js特效代码兼容:ie6 、ie7 、ie8 、ie9 、ie10 、ie11 、chrome 、firefox 、opera 、safari 、 等浏览器

jQuery动态加载图片相册,弹窗大图特效
<!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">    
<head>        
<title>jQuery动态加载图片相册,弹窗大图特效</title>    
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />    
<link rel='stylesheet' href='css/justifiedgallery.min.css' type='text/css' media='all' />    
<link rel='stylesheet' href='css/swipebox.css' type='text/css' media='screen' />    
<link rel='stylesheet' href='css/colorbox.css' type='text/css' media='screen' />    
<script src='js/jquery.min.js'></script>    
<script src='js/justifiedgallery.js'></script>    
<script src='js/jquery.swipebox.min.js'></script>    
<script src='js/jquery.colorbox-min.js'></script>    
<script>    
       	$(document).ready(function() {    
       		$('#remotetest').justifiedGallery({rel: 'gal0'}).on('jg.rowflush', function () {    
       			$(this).find('a').colorbox({    
       				maxWidth : '80%',    
       				maxHeight : '80%',    
       				opacity : 0.8,    
       				transition : 'elastic',    
       				current : ''    
       			});    
       		});    
       	});    
</script>    
</head>    
<body>    
<div id="remotetest"  style="border: 1px solid black;">    
<a href="images/6791628438_affaa19e10_b.jpg" title="This is the colors I love">    
<img alt="This is the colors I love" src="images/6791628438_affaa19e10_m.jpg" />    
</a>    
<a href="images/6916180091_9c9559e463_b.jpg" title="The Hope">    
<img alt="The Hope" src="images/6916180091_9c9559e463_m.jpg" />    
</a>    
<a href="images/6880502467_d4b3c4b2a8_b.jpg" title="Florence streets. Florence people.">    
<img alt="Florence streets. Florence people." src="images/6880502467_d4b3c4b2a8_m.jpg" />    
</a>    
<a href="images/6876412479_6268c6e2aa_b.jpg" title="I Love You">    
<img alt="I Love You" src="images/6876412479_6268c6e2aa_m.jpg" />    
</a>    
<a href="images/6840627709_92ed52fb41_b.jpg" title="The painter in Florence">    
<img alt="The painter in Florence" src="images/6840627709_92ed52fb41_m.jpg" />    
</a>    
<a href="images/6812090617_5fd5bbdda0_b.jpg" title="Me and My Belover">    
<img alt="Me and My Belover" src="images/6812090617_5fd5bbdda0_m.jpg" />    
</a>    
<a href="images/6806687375_07d2b7a1f9_b.jpg" title="Fiocco">    
<img alt="Fiocco" src="images/6806687375_07d2b7a1f9_m.jpg" />    
</a>    
<a href="images/6798453217_72dea2d06e_b.jpg" title="My first clothespin">    
<img alt="My first clothespin" src="images/6798453217_72dea2d06e_m.jpg" />    
</a>    
<a href="images/8083451788_552becfbc7_b.jpg" title="What's your destination?">    
<img alt="What's your destination?" src="images/8083451788_552becfbc7_m.jpg" />    
</a>    
<a href="images/7948632554_01f6ae6b6f_b.jpg" title="Just in a dream Place">    
<img alt="Just in a dream Place" src="images/7948632554_01f6ae6b6f_m.jpg" />    
</a>    
<a href="images/7302459122_19fa1d8223_b.jpg" title="Truthful Innocence">    
<img alt="Truthful Innocence" src="images/7302459122_19fa1d8223_m.jpg" />    
</a>    
<a href="images/7222046648_5bf70e893a_b.jpg" title="Simply my Brother">    
<img alt="Simply my Brother" src="images/7222046648_5bf70e893a_m.jpg" />    
</a>    
<a href="images/7002395006_29fdc85f7a_b.jpg" title="Freedom">    
<img alt="Freedom" src="images/7002395006_29fdc85f7a_m.jpg" />    
</a>    
<a href="images/7062575651_b23918b11a_b.jpg" title="Maybe spring">    
<img alt="Maybe spring" src="images/7062575651_b23918b11a_m.jpg" />    
</a>    
<a href="images/6841267340_855273fd7e_b.jpg" title="Love">    
<img alt="Love" src="images/6841267340_855273fd7e_m.jpg" />    
</a>    
<a href="images/6958456697_e56a37bb5f_b.jpg" title="Young Lovers' Wall and the Old Rain">    
<img alt="Young Lovers' Wall and the Old Rain" src="images/6958456697_e56a37bb5f_m.jpg" />    
</a>    
</div>    
</body>    
</html>



图片 动态 相册

jquery图片相册特效,切换上下页,还带对话框提醒特效

jqzoom仿京东商品详细页产品图片放大镜特效

jquery实现图片相册淡入淡出特效插件

jquery实现全屏图片左右滚动预览焦点图特效

js、html5实现极速3D立体式图片相册切换效果

jquery鼠标悬停图片高亮,从左边滑动出标题信息显示效果

jQuery+CSS3 实现动画图片相册,大图全屏展示,前后翻页特效代码

Css3鼠标悬停图片高亮特效

jquery鼠标经过向上滑动标题,可以左右切换图片位置!

query自适应图片高度并带播放提示的相册特效

jquery实现网页右下角弹出并且支持tab标签选项卡的图片广告代码

JS仿腾讯娱乐图片频道满屏左右切换焦点图特效

jQuery仿QQ空间鼠标感应上下滚动预览图片特效

jQuery多张图片相册上下切换,放大预览等特效

jquery实现鼠标移动到图片上显示大图广告特效

JS带图片标题自动播放的幻灯片特效

jQuery动态加载图片相册,弹窗大图特效

jquery实现led广告牌旋转图片切换特效

jquery实现会滚动的新闻列表和图片滚动特效

jquery.slider多种过渡效果的图片轮播幻灯片特效

jQuery粒子图腾动态背景特效

jquery实现网站注册动态步骤导航条特效

jquery实现动态文字倾斜显示特效代码

纯css3制作动态天气图标动画特效代码

jQuery右侧动态缩放图片切换特效

jquery仿百度首页问答数滚动效果_jquery滚动数字动态更新特效代码