//viewerjs插件引用 var viewer2; var index = 0; var links =''; var arry =[]; var image = new Image(); var setId //计时器 //获取项目名 var pathName = window.document.location.pathname; var projectName =pathName.substring(0,pathName.substr(1).indexOf('/')+1); //点击事件 Ext.fly(document).on('click', function(ev){ //获取点击的a链接 var target = ev.getTarget('a[ref=img]'); if (target) { target.blur();//去掉a标签焦点 // ev.preventDefault();//取消默认事件 index = 0; //索引置空 indexs(target.href); //获取数组 //预览图片 //this.show_viewer_singer(target.href, target.text); } //按钮下一页、上一页 var target_next = ev.getTarget('.viewer-next'); var target_prev = ev.getTarget('.viewer-prev'); if (target_next){ target_next.blur();//去掉a标签焦点 ev.preventDefault();//取消事件的默认动作。 clearTimeout(setId);//清除计时器 next(target_next); } if (target_prev){ target_prev.blur();//去掉a标签焦点 ev.preventDefault();//取消事件的默认动作。 clearTimeout(setId);//清除计时器 prev(target_prev); } }, this); //获取数组、索引 function indexs(href,staus){ var setItems; if (staus == '_more'){ setItems = Ext.query('a'); }else{ setItems = Ext.query('a[ref=img]'); } arry.length=0;//置空数组 Ext.each(setItems, function(item) { if(staus == '_more'){ if(item.href && item.href.indexOf('javascript:window[\''+'show_viewer_more'+'\']') != -1) { var list= item.href.split(','); var id =list[1].replace("\'","").replace("\'",""); arry.push([ links+ id ,item.text]); } }else{ if(item.href){ arry.push([item.href,item.text]); } } }); while (arry[index][0].replace(/%27/g,'')!= href) { index++; } } //上一页 function prev(target_prev){ viewer2.destroy();//销毁容器,退出预览 var src,alt; var div = document.getElementById('view-imgs'); if (index == 0 ){ index = arry.length-1 ; }else{ index = -- index ; } for (i = 0 ; i < arry.length; i++){ if (index == i){ src = arry[i][0].replace(/%27/g,''); alt = arry[i][1]; } } show_viewer_singer(src, alt); } //下一页 function next(target_next){ viewer2.destroy();//销毁预览容器 var src,alt; if (index == arry.length-1){ index = 0; }else{ index = ++ index ; } for (i = 0 ; i < arry.length; i++){ if (index == i){ src = arry[i][0].replace(/%27/g,''); alt = arry[i][1]; } } show_viewer_singer(src, alt); } // 键盘捕捉事件 document.onkeydown=function(ev){ var e =ev || window.event || arguments.callee.caller.arguments[0]; if (e && viewer2.ready){ var keyCode = ev.keyCode; if (keyCode == 39 || keyCode == 68){ //D var target_next =Ext.query('.viewer-next'); if (target_next.length == 1){ next(target_next[0]); } }else if (keyCode == 37 || keyCode == 65){//A var target_prev = Ext.query('.viewer-prev'); if (target_prev.length == 1){ prev(target_prev[0]); } }else if( keyCode== 87){//W ev.preventDefault(); viewer2.zoom(0.1,true); }else if (keyCode==83){//S ev.preventDefault(); viewer2.zoom(-0.1,true); }else if (keyCode == 81){//Q ev.preventDefault(); viewer2.rotate(-90); }else if (keyCode == 69){//E ev.preventDefault(); viewer2.rotate(90); } } } function show_viewer_more(link , id , name ,value) { if (document.activeElement.tagName == 'A'){ document.activeElement.blur();//去掉a标签焦点 } var src = link+id; //点击a连接的图片地址 links = link; //数组中的图片地址 index = 0; //索引置空 indexs(src,'_more'); //生成索引 //预览图片 this.show_viewer_singer(src, name); } function show_viewer_singer(src, name) { image.src = src ; image.alt = index+1 +'/'+ arry.length; var viewer = new Viewer(image, { hidden: function() { viewer.destroy(); }, toolbar: { zoomIn: 3, zoomOut: 3, oneToOne: 3, reset: 3, prev: 3, play: { show: 3, size: 'large', }, next: 3, rotateLeft: 3, rotateRight: 3, flipHorizontal: 3, flipVertical: 3, }, navbar:0, zoomRatio:0.5, keyboard :true, }); viewer.show(); viewer2 = viewer; /*setId =setTimeout(function(){ if(viewer2.image.width !=0 && viewer2.image.height!=0){ viewer2.image.src=projectName+'/viewerjs/img_error.jpg'; viewer2.image.style.cssText = "height: 208px; margin-left: 461px; margin-top: 150.5px; position: absolute; width: 426px; max-width: none !important; transform: none;" } if(image.width !=0 && image.height!=0){ image.src=projectName+'/viewerjs/img_error.jpg'; } },15000);*/ }