;(function($){
var wdimgarr=[];
var wdimgtitle=[];
var arrindex='';
function wdimageview(opts){
this.opts = $.extend({},this.defined,opts);
this.opts.body = $('body');
this.opts.winw = $(window).width();
this.opts.winh = $(window).height();
this.init(this.opts);//初始化
//点击元素触发
this.clickaction(this.opts);
this.clickclosed();
this.clicknext();
this.clickprev();
}
//初始化,向页面中插入dom
wdimageview.prototype.init=function(){
var opts = this.opts;
var maskhtml='
';
var mainhtml=''+
'';
var titlehtml = '';
var allhtml = maskhtml + mainhtml;
opts.body.append(allhtml);
if(opts.showtitle){
$('#imgbox').append(titlehtml);
}
}
//点击时触发
wdimageview.prototype.clickaction = function (opts){
var opts=opts;
var obj = this;
$(document).on('click',opts.dom+'['+opts.group+']',function (ev){
if(wdimgarr.length>0){
wdimgarr=[];
wdimgtitle=[];
}
$(opts.dom+'['+opts.group+']').each(function(index,item){
wdimgarr.push($(this).attr(opts.item))
wdimgtitle.push($(this).attr(opts.title))
});
var _thisindex = wdimgarr.search($(this).attr(opts.item));
if(_thisindex!=-1){
arrindex = _thisindex;
obj.loadimg(wdimgarr,wdimgtitle,_thisindex);
}
return false;
ev.preventdefault();
})
}
//加载图片
wdimageview.prototype.loadimg=function (imgurl,imgtitle,index){
var obj = this;
var opts = this.opts;
var animateopst={};
console.log(this.opts);
var objimg = new image();
objimg.src=imgurl[index];
var imgw,imgh;
objimg.onload=function(){
$('#wdimagesview-mask').show();
imgw = this.width;
imgh = this.height;
$('#wdimagesview-closed').fadein();
$('.wdimagesview-arr').fadein();
obj.showimg(imgw,imgh);
}
}
wdimageview.prototype.showimg = function (imgw,imgh){
var obj = this;
var opts = this.opts;
$('#imgbox img').hide();
$('#wdimagesview-main').show();
if(imgh>700){
imgw=imgw*700/imgh;
imgh=700;
}
if(imgw>1000){
imgh=imgh*1000/imgw;
imgw=1000;
}
$('#wdimagesview-main').animate({
width:imgw,
height:imgh,
marginleft:-imgw/2,
margintop:-imgh/2
},300,'linear',function (){
$('#imgbox img').show().attr('src',wdimgarr[arrindex]);
$('#imgtitle').empty().append(wdimgtitle[arrindex]);
})
}
//下一张图片
wdimageview.prototype.clicknext = function (){
var obj = this;
var opst = this.opts;
$(document).on('click','#wdnext',function(){
if(!$('#wdimagesview-main').is(':animated')){
var arrlen = wdimgarr.length;
if(arrindex==(arrlen-1)){
obj.loadimg(wdimgarr,wdimgtitle,arrindex);
}else{
console.log(arrindex);
console.log(wdimgarr);
console.log(wdimgtitle);
arrindex = arrindex+1;
if(arrindex-1){
console.log('prevdo')
obj.loadimg(wdimgarr,wdimgtitle,arrindex);
}
}
}
})
}
//关闭
wdimageview.prototype.clickclosed=function (){
var obj = this;
$('#wdimagesview-closed,#wdimagesview-mask').on('click',function (){
obj.allclosed();
});
}
wdimageview.prototype.allclosed = function (){
var opts = this.opts;
var obj = this;
var animateopst={};
$('#wdimagesview-main').hide();
$('#wdimagesview-closed').hide();
$('.wdimagesview-arr').hide();
$('#wdimagesview-main').css({
width:400,
height:300,
marginleft:-200,
margintop:-150
})
$('#wdimagesview-mask').hide();
$('#imgbox img').hide();
$('#imgtitle').empty();
}
//默认参数
wdimageview.prototype.defined={
dom:'a',
group:'rel',
item:'href',
title:'reltitle',
showtitle:false,
time:'1000',
path:'',//图片相对路径
loadimg:function(){}
}
//生成是jq组件
$.extend({
wdimageview:function(opts){
return new wdimageview(opts);
}
})
//为原生数组添加查找数组方法,如果查找到就返回数组下标
array.prototype.search = function (value) {
var i = this.length;
while (i--) {
if (this[i] == value) {
return i;
}
}
return -1;
}
})(jquery)