document.writeln("
");
document.writeln("
");
document.writeln("
");
document.writeln("
");
//运行函数
var initphotoswipefromdom = function(galleryselector,gallerytagname) {
// parse slide data (url, title, size ...) from dom elements
// (children of galleryselector)
var parsethumbnailelements = function(el) {
var thumbelements = el.childnodes,
numnodes = thumbelements.length,
items = [],
figureel,
linkel,
size,
item;
for(var i = 0; i < numnodes; i++) {
figureel = thumbelements[i]; // element
// include only element nodes
if(figureel.nodetype !== 1) {
continue;
}
linkel = figureel.children[0]; // element
size = linkel.getattribute('data-size').split('x');
// create slide object
item = {
src: linkel.getattribute('href'),
w: parseint(size[0], 10),
h: parseint(size[1], 10),
title: linkel.getattribute('title')
};
if(linkel.children.length > 0) {
//
thumbnail element, retrieving thumbnail url
item.msrc = linkel.children[0].getattribute('src');
}
item.el = figureel; // save link to element for getthumbboundsfn
items.push(item);
}
return items;
};
// find nearest parent element
var closest = function closest(el, fn) {
return el && ( fn(el) ? el : closest(el.parentnode, fn) );
};
// triggers when user clicks on thumbnail
var onthumbnailsclick = function(e) {
e = e || window.event;
e.preventdefault ? e.preventdefault() : e.returnvalue = false;
var etarget = e.target || e.srcelement;
// find root element of slide
var clickedlistitem = closest(etarget, function(el) {
return (el.tagname && el.tagname.touppercase() === gallerytagname);
});
if(!clickedlistitem) {
return;
}
// find index of clicked item by looping through all child nodes
// alternatively, you may define index via data- attribute
var clickedgallery = clickedlistitem.parentnode,
childnodes = clickedlistitem.parentnode.childnodes,
numchildnodes = childnodes.length,
nodeindex = 0,
index;
for (var i = 0; i < numchildnodes; i++) {
if(childnodes[i].nodetype !== 1) {
continue;
}
if(childnodes[i] === clickedlistitem) {
index = nodeindex;
break;
}
nodeindex++;
}
if(index >= 0) {
// open photoswipe if valid index found
openphotoswipe( index, clickedgallery );
}
return false;
};
// parse picture index and gallery index from url (#&pid=1&gid=2)
var photoswipeparsehash = function() {
var hash = window.location.hash.substring(1),
params = {};
if(hash.length < 5) {
return params;
}
var vars = hash.split('&');
for (var i = 0; i < vars.length; i++) {
if(!vars[i]) {
continue;
}
var pair = vars[i].split('=');
if(pair.length < 2) {
continue;
}
params[pair[0]] = pair[1];
}
if(params.gid) {
params.gid = parseint(params.gid, 10);
}
return params;
};
var openphotoswipe = function(index, galleryelement, disableanimation, fromurl) {
var pswpelement = document.queryselectorall('.pswp')[0],
gallery,
options,
items;
items = parsethumbnailelements(galleryelement);
// define options (if needed)
options = {
// define gallery index (for url)
galleryuid: galleryelement.getattribute('data-pswp-uid'),
getthumbboundsfn: function(index) {
// see options -> getthumbboundsfn section of documentation for more info
var thumbnail = items[index].el.getelementsbytagname('img')[0], // find thumbnail
pageyscroll = window.pageyoffset || document.documentelement.scrolltop,
rect = thumbnail.getboundingclientrect();
return {x:rect.left, y:rect.top + pageyscroll, w:rect.width};
}
};
// photoswipe opened from url
if(fromurl) {
if(options.gallerypids) {
// parse real index when custom pids are used
// http://photoswipe.com/documentation/faq.html#custom-pid-in-url
for(var j = 0; j < items.length; j++) {
if(items[j].pid == index) {
options.index = j;
break;
}
}
} else {
// in url indexes start from 1
options.index = parseint(index, 10) - 1;
}
} else {
options.index = parseint(index, 10);
}
// exit if index not found
if( isnan(options.index) ) {
return;
}
if(disableanimation) {
options.showanimationduration = 0;
}
// pass data to photoswipe and initialize it
gallery = new photoswipe( pswpelement, photoswipeui_default, items, options);
gallery.init();
};
// loop through all gallery elements and bind events
var galleryelements = document.queryselectorall( galleryselector );
for(var i = 0, l = galleryelements.length; i < l; i++) {
galleryelements[i].setattribute('data-pswp-uid', i+1);
galleryelements[i].onclick = onthumbnailsclick;
}
// parse url and open gallery if it contains #&pid=3&gid=1
var hashdata = photoswipeparsehash();
if(hashdata.pid && hashdata.gid) {
openphotoswipe( hashdata.pid , galleryelements[ hashdata.gid - 1 ], true, true );
}
};