📄 highslide-full.js
字号:
},
destroy : function(hide) {
if (hide) this.table.style.visibility = 'hidden';
else {
hs.purge(this.table);
try { this.table.parentNode.removeChild(this.table); } catch (e) {}
}
}
};
//-----------------------------------------------------------------------------
// The expander object
hs.Expander = function(a, params, custom, contentType) {
this.a = a;
this.custom = custom;
this.contentType = contentType || 'image';
this.isHtml = (contentType == 'html');
this.isImage = !this.isHtml;
hs.continuePreloading = false;
hs.genContainer();
var key = this.key = hs.expanders.length;
// override inline parameters
for (var i = 0; i < hs.overrides.length; i++) {
var name = hs.overrides[i];
this[name] = params && typeof params[name] != 'undefined' ?
params[name] : hs[name];
}
// get thumb
var el = this.thumb = (params ? hs.$(params.thumbnailId) : null)
|| a.getElementsByTagName('IMG')[0] || a;
this.thumbsUserSetId = el.id || a.id;
if (!hs.fireEvent(this, 'onInit')) return;
// check if already open
for (var i = 0; i < hs.expanders.length; i++) {
if (hs.expanders[i] && hs.expanders[i].a == a) {
hs.expanders[i].focus();
return false;
}
}
// cancel other
for (var i = 0; i < hs.expanders.length; i++) {
if (hs.expanders[i] && hs.expanders[i].thumb != el && !hs.expanders[i].onLoadStarted) {
hs.expanders[i].cancelLoading();
}
}
hs.expanders[this.key] = this;
if (!hs.allowMultipleInstances) {
try { hs.expanders[key - 1].close(); } catch (e){}
try { hs.expanders[hs.focusKey].close(); } catch (e){} // preserved
}
this.overlays = [];
var pos = hs.position(el);
// store properties of thumbnail
this.thumbWidth = el.width ? el.width : el.offsetWidth;
this.thumbHeight = el.height ? el.height : el.offsetHeight;
this.thumbLeft = pos.x;
this.thumbTop = pos.y;
this.thumbOffsetBorderW = (this.thumb.offsetWidth - this.thumbWidth) / 2;
this.thumbOffsetBorderH = (this.thumb.offsetHeight - this.thumbHeight) / 2;
// instanciate the wrapper
this.wrapper = hs.createElement(
'div',
{
id: 'highslide-wrapper-'+ this.key,
className: this.wrapperClassName
},
{
visibility: 'hidden',
position: 'absolute',
zIndex: hs.zIndexCounter++
}, null, true );
this.wrapper.onmouseover = function (e) {
try { hs.expanders[key].wrapperMouseHandler(e); } catch (e) {}
};
this.wrapper.onmouseout = function (e) {
try { hs.expanders[key].wrapperMouseHandler(e); } catch (e) {}
};
if (this.contentType == 'image' && this.outlineWhileAnimating == 2)
this.outlineWhileAnimating = 0;
// get the outline
if (hs.pendingOutlines[this.outlineType]) {
this.connectOutline();
this[this.contentType +'Create']();
} else if (!this.outlineType) {
this[this.contentType +'Create']();
} else {
this.displayLoading();
var exp = this;
new hs.Outline(this.outlineType,
function () {
exp.connectOutline();
exp[exp.contentType +'Create']();
}
);
}
};
hs.Expander.prototype = {
connectOutline : function(x, y) {
var w = hs.pendingOutlines[this.outlineType];
this.objOutline = w;
w.table.style.zIndex = this.wrapper.style.zIndex;
hs.pendingOutlines[this.outlineType] = null;
},
displayLoading : function() {
if (this.onLoadStarted || this.loading) return;
this.originalCursor = this.a.style.cursor;
this.a.style.cursor = 'wait';
this.loading = hs.loading;
var exp = this;
this.loading.onclick = function() {
exp.cancelLoading();
};
if (!hs.fireEvent(this, 'onShowLoading')) return;
this.loading.style.top = (this.thumbTop
+ (this.thumbHeight - this.loading.offsetHeight) / 2) +'px';
var exp = this, left = (this.thumbLeft + this.thumbOffsetBorderW
+ (this.thumbWidth - this.loading.offsetWidth) / 2) +'px';
setTimeout(function () { if (exp.loading) exp.loading.style.left = left }, 100);
},
imageCreate : function() {
var exp = this;
var img = document.createElement('img');
this.content = img;
img.onload = function () {
if (hs.expanders[exp.key]) exp.contentLoaded();
};
img.className = 'highslide-image';
img.style.visibility = 'hidden'; // prevent flickering in IE
img.style.display = 'block';
img.style.position = 'absolute';
img.style.maxWidth = 'none';
img.style.zIndex = 3;
img.title = hs.restoreTitle;
if (hs.safari) hs.container.appendChild(img);
// uncomment this to flush img size:
// if (hs.ie) img.src = null;
img.src = hs.getSrc(this.a);
this.displayLoading();
},
htmlCreate : function () {
if (!hs.fireEvent(this, 'onBeforeGetContent')) return;
this.tempContainer = hs.createElement('div', { className: this.wrapperClassName },
{
padding: '0 '+ hs.marginRight +'px 0 '+ hs.marginLeft +'px',
visibility: 'hidden'
}, hs.container
);
this.content = hs.getCacheBinding(this.a);
if (!this.content)
this.content = hs.getNode(this.contentId);
if (!this.content)
this.content = hs.getSelfRendered();
hs.fireEvent(this, 'onAfterGetContent');
this.innerContent = this.content;
if (this.swfObject || this.objectType == 'iframe') this.setObjContainerSize(this.innerContent);
this.tempContainer.appendChild(this.innerContent); // to get full width
hs.setStyles (this.innerContent, { position: 'relative', visibility: 'hidden' });
this.innerContent.className += ' highslide-display-block';
if (this.innerContent.offsetWidth < this.minWidth)
this.innerContent.style.width = this.minWidth +'px';
this.content = hs.createElement(
'div',
{ className: 'highslide-html' },
{
position: 'relative',
zIndex: 3,
overflow: 'hidden',
width: this.thumbWidth +'px',
height: this.thumbHeight +'px'
}
);
if (this.objectType == 'ajax' && !hs.getCacheBinding(this.a)) {
var ajax = new hs.Ajax(this.a, this.innerContent);
var exp = this;
ajax.onLoad = function () { exp.contentLoaded(); };
ajax.onError = function () { location.href = hs.getSrc(this.a); };
ajax.run();
}
else
if (this.objectType == 'iframe' && this.objectLoadTime == 'before') {
this.writeExtendedContent();
}
else
this.contentLoaded();
},
contentLoaded : function() {
try {
if (!this.content) return;
if (this.onLoadStarted) return; // old Gecko loop
else this.onLoadStarted = true;
if (this.loading) {
this.loading.style.left = '-9999px';
this.loading = null;
this.a.style.cursor = this.originalCursor || '';
hs.fireEvent(this, 'onHideLoading');
}
this.marginBottom = hs.marginBottom;
if (this.isImage) {
this.newWidth = this.content.width;
this.newHeight = this.content.height;
this.fullExpandWidth = this.newWidth;
this.fullExpandHeight = this.newHeight;
this.content.style.width = this.thumbWidth +'px';
this.content.style.height = this.thumbHeight +'px';
this.getCaption();
} else if (this.htmlGetSize) this.htmlGetSize();
this.wrapper.appendChild(this.content);
this.content.style.position = 'relative'; // Saf
if (this.caption) this.wrapper.appendChild(this.caption);
this.wrapper.style.left = this.thumbLeft +'px';
this.wrapper.style.top = this.thumbTop +'px';
hs.container.appendChild(this.wrapper);
// correct for borders
this.offsetBorderW = (this.content.offsetWidth - this.thumbWidth) / 2;
this.offsetBorderH = (this.content.offsetHeight - this.thumbHeight) / 2;
var modMarginRight = hs.marginRight + 2 * this.offsetBorderW;
this.marginBottom += 2 * this.offsetBorderH;
var ratio = this.newWidth / this.newHeight;
var minWidth = this.allowSizeReduction
? this.minWidth : this.newWidth;
var minHeight = this.allowSizeReduction
? this.minHeight : this.newHeight;
var justify = { x: 'auto', y: 'auto' };
if (this.align == 'center') {
justify.x = 'center';
justify.y = 'center';
} else {
if (this.anchor.match(/^top/)) justify.y = null;
if (this.anchor.match(/right$/)) justify.x = 'max';
if (this.anchor.match(/^bottom/)) justify.y = 'max';
if (this.anchor.match(/left$/)) justify.x = null;
}
var page = hs.getPageSize();
// justify
this.x = {
min: parseInt(this.thumbLeft) - this.offsetBorderW + this.thumbOffsetBorderW,
span: this.newWidth,
minSpan: (this.newWidth < minWidth && !hs.padToMinWidth)
? this.newWidth : minWidth,
justify: justify.x,
target: this.targetX,
marginMin: hs.marginLeft,
marginMax: modMarginRight,
scroll: page.scrollLeft,
clientSpan: page.width,
thumbSpan: this.thumbWidth
};
var oldRight = this.x.min + parseInt(this.thumbWidth);
this.x = this.justify(this.x);
this.y = {
min: parseInt(this.thumbTop) - this.offsetBorderH + this.thumbOffsetBorderH,
span: this.newHeight,
minSpan: this.newHeight < minHeight ? this.newHeight : minHeight,
justify: justify.y,
target: this.targetY,
marginMin: hs.marginTop,
marginMax: this.marginBottom,
scroll: page.scrollTop,
clientSpan: page.height,
thumbSpan: this.thumbHeight
};
var oldBottom = this.y.min + parseInt(this.thumbHeight);
this.y = this.justify(this.y);
if (this.isHtml) this.htmlSizeOperations();
if (this.isImage)
this.correctRatio(ratio);
var x = this.x;
var y = this.y;
this.show();
} catch (e) {
window.location.href = hs.getSrc(this.a);
}
},
setObjContainerSize : function(parent, auto) {
var c = hs.getElementByClass(parent, 'DIV', 'highslide-body');
if (this.objectType == 'iframe') {
if (this.objectWidth) c.style.width = this.objectWidth +'px';
if (this.objectHeight) c.style.height = this.objectHeight +'px';
}
if (this.swfObject) {
c.style.width = this.swfObject.attributes.width +'px';
c.style.height = this.swfObject.attributes.height +'px';
}
},
writeExtendedContent : function (loadTime) {
if (this.hasExtendedContent) return;
var exp = this;
this.body = hs.getElementByClass(this.innerContent, 'DIV', 'highslide-body');
if (this.objectType == 'iframe') {
this.displayLoading();
this.ruler = hs.clearing.cloneNode(1);
this.body.appendChild(this.ruler);
this.newWidth = this.innerContent.offsetWidth;
if (!this.objectWidth) this.objectWidth = this.ruler.offsetWidth;
var hDiff = this.innerContent.offsetHeight - this.body.offsetHeight;
var h = this.objectHeight || (hs.getPageSize()).height - hDiff - hs.marginTop - hs.marginBottom;
var onload = (hs.ie && this.objectLoadTime == 'before') ?
'onload="try {hs.expanders['+ this.key +'].contentLoaded()} catch(e){}"' : '';
var tag = hs.ie ? '<iframe name="hsIframe'+ this.key+ '" '+ onload +'/>' : 'iframe';
this.iframe = hs.createElement(tag,
{ name: 'hsIframe'+ this.key, frameBorder: 0, allowTransparency: true },
{ width: this.objectWidth +'px', height: h +'px' },
this.body);
if (this.objectLoadTime == 'before') {
if (!hs.ie) this.iframe.onload = function () { try { exp.contentLoaded(); } catch (e) {}};
}
if (hs.safari) this.iframe.src = null;
this.iframe.src = hs.getSrc(this.a);
if (this.objectLoadTime == 'after') this.correctIframeSize();
} else if (this.swfObject) {
this.body.id = this.body.id || 'hs-flash-id-' + this.key;
this.swfObject.write(this.body.id);
}
this.hasExtendedContent = true;
},
htmlGetSize : function() {
if (this.iframe && !this.objectHeight) { // loadtime before
try {
var doc = this.iframe.contentDocument || this.iframe.contentWindow.document;
var clearing = doc.createElement('div');
clearing.style.clear = 'both';
doc.body.appendChild(clearing);
var h = clearing.offsetTop;
if (hs.ie) h += parseInt(doc.body.currentStyle.marginTop)
+ parseInt(doc.body.currentStyle.marginBottom) - 1;
this.iframe.style.height = this.body.style.height = h +'px';
} catch (e) { // other domain
this.iframe.style.height = '300px';
}
}
this.innerContent.appendChild(hs.clearing);
if (!this.newWidth) this.newWidth = this.innerContent.offsetWidth;
this.newHeight = this.innerContent.offsetHeight;
this.innerContent.removeChild(hs.clearing);
if (hs.ie && this.newHeight > parseInt(this.innerContent.currentStyle.height)) { // ie css bug
this.newHeight = parseInt(this.innerContent.currentStyle.height);
}
},
correctIframeSize : function () {
var wDiff = this.innerContent.offsetWidth - this.ruler.offsetWidth;
if (wDiff < 0) wDiff = 0;
var hDiff = this.innerContent.offsetHeight - this.body.offsetHeight;
hs.setStyles(this.iframe, { width: (this.x.span - wDiff) +'px',
height: (this.y.span - hDiff) +'px' });
hs.setStyles(this.body, { width: this.iframe.style.width,
height: this.iframe.style.height });
this.scrollingContent = this.iframe;
this.scrollerDiv = this.scrollingContent;
},
htmlSizeOperations : function () {
this.setObjContainerSize(this.innerContent);
if (this.swfObject && this.objectLoadTime == 'before') this.writeExtendedContent();
// handle minimum size
if (this.x.span < this.newWidth && !this.allowWidthReduction) this.x.span = this.newWidth;
if (this.y.span < this.newHeight && !this.allowHeightReduction) this.y.span = this.newHeight;
this.scrollerDiv = this.innerContent;
this.mediumContent = hs.createElement('div', null,
{
width: this.x.span +'px',
position: 'relative',
left: (this.x.min - this.thumbLeft) +'px',
top: (this.y.min - this.thumbTop) +'px'
}, this.content, true);
this.mediumContent.appendChild(this.innerContent);
hs.container.removeChild(this.tempContainer);
hs.setStyles(this.innerContent, { border: 'none', width: 'auto', height: 'auto' });
var node = hs.getElementByClass(this.innerContent, 'DIV', 'highslide-body');
if (node && !this.swfObject && this.objectType != 'iframe') {
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -