带开关灯效果的jquery相册插件Album是一款效果非常棒的jquery特效,Album相册插件用法超简单,页面初始化的时间只写一行代码就行了,Album.set("#Album");,就算你不懂前端这块也不要紧,只把要相应的样式文件和jquery插件文件引入即可。。。
首先引用文件
<link rel="stylesheet" href="style/style_home1.css" type="text/css" media="all">
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/album.js"></script>
页面初始化的时间只写一行代码就行了,Album.set("#Album");,就算你不懂前端这块也不要紧,1.图片延迟加载2、jquery相册3、弹出层4、鼠标悬浮效果等
int: function(o){
var that = this;
this.aImg = $(o).find('img');
this._css = null;
this.iLoad = 0;
this.zoom = 1.5;
this.i=0;
this.ok = false;
this.aEm = $('em',$(o));
this.tLayer = null;
this.aImg.each(function(){
$(this).load(function(){
that.iLoad++;
if(that.iLoad==that.aImg.length&&!that.ok){
that.pos(o);
}
})
});
setTimeout(function(){
if(!that.ok){that.pos(o);}
},2000);
},
pos:function(o){
var that = this;
that.ok = true;
$('a',$(o)).each(function(){
var oP = $(this).parent();
var oS = $(this).siblings('.Album_info');
oP.css({'width':$('img',this).width(),'height':$('img',this).height()})
$(this).css({'top':oP.position().top,'left':oP.position().left});
$('em',this).css({'height':oP.height(),'filter': 'alpha(opacity=50)'});
if($(o).width()-oP.position().left>=$(this).width()*6){
oS.css({'height':Math.round($(this).height()*that.zoom)+4,'left':oP.position().left-2,'right':'auto','padding-left':Math.round($(this).width()*that.zoom)})
}else{
oS.css({'height':$(this).height()*that.zoom+4,'right':$(o).width()-oP.position().left-$(this).width()-2,'left':'auto','padding-right':Math.round($(this).width()*that.zoom),'text-align':'right'})
}
if(oP.position().top>=Math.round($(this).height()*(that.zoom-1)/2)&&$(o).height()-oP.position().top-$(this).height()>=Math.round($(this).height()*(that.zoom-1)/2)){
oS.css('top',oP.position().top-Math.round($(this).height()*(that.zoom-1)/2)-2)
}else if(oP.position().top<Math.round($(this).height()*(that.zoom-1)/2)){
oS.css('top',$(this).parent().position().top-2)
}else{
oS.css('top',$(this).parent().position().top-Math.round($(this).height()*(that.zoom-1)+2))
}
});
this.showImg(o)
},
系统已开启自动识别垃圾评论机制,识别到的自动封号,下载出错或者资源有问题请联系全栈客服QQ 1915635791