Partage
  • Partager sur Facebook
  • Partager sur Twitter

Configuration d'highslide

Sujet résolu
    11 février 2010 à 9:53:01

    Bonjour à tous,
    Je développe actuellement ma page web afin de mettre en ligne mes travaux en temps que graphiste. Le CSS et le Javascript c'est bien, quand ça marche xD.
    Voila donc le site en question: http://kieldesign.perso.sfr.fr

    Mes problèmes se trouvent sur la page "works", plus précisement avec la galerie Highslide. J'aimerais donc:
    -supprimer le "powered by highslide" en haut de la galerie
    -décaller les miniatures sur la gauche
    -obtenir des boutons pour les liens "next, previous, 1:1"

    Comme sur ce modèle: Image utilisateur
    (pour avoir le code de l'exemple il suffit de télécharger le dossier highslide sur le site http://highslide.com/download.php Il se trouve dans "example" sous le nom: gallery-vertical-strip .

    Merci d'avance pour votre aide :D
    • Partager sur Facebook
    • Partager sur Twitter
      11 février 2010 à 11:11:51

      Bah déjà, avec ton JS compressé, tu risques pas de faire grand chose.

      Supprimer le powered, c'est pas super cool.

      Mais bon, c'est dans les premiers paramètres d'initialisation du script. Tu as un booléen "showCredits" qu'il suffit de passer à false (je suppose).
      • Partager sur Facebook
      • Partager sur Twitter
        11 février 2010 à 11:56:22

        je viens de regarder, le booléen hs.showCredits n'était pas dans le scripts, je viens de le rajouté, et ça marche (enjoy) merci :D.
        Par contre, qu'est ce que tu veux dire par "mon JS est compréssé"? (Noob inside :D)
        • Partager sur Facebook
        • Partager sur Twitter
          11 février 2010 à 12:10:48

          Bah compressé. Illisible par un être humain quoi.
          http://kieldesign.perso.sfr.fr/scripts/highslide.js

          Le code décompressé, c'est celui-là :


          /******************************************************************************
          Name:    Highslide JS
          Version: 4.1.8 (October 27 2009)
          Config:  default
          Author:  Torstein Hønsi
          Support: http://highslide.com/support
          
          Licence:
          Highslide JS is licensed under a Creative Commons Attribution-NonCommercial 2.5
          License (http://creativecommons.org/licenses/by-nc/2.5/).
          
          You are free:
          	* to copy, distribute, display, and perform the work
          	* to make derivative works
          
          Under the following conditions:
          	* Attribution. You must attribute the work in the manner  specified by  the
          	  author or licensor.
          	* Noncommercial. You may not use this work for commercial purposes.
          
          * For  any  reuse  or  distribution, you  must make clear to others the license
            terms of this work.
          * Any  of  these  conditions  can  be  waived  if  you  get permission from the 
            copyright holder.
          
          Your fair use and other rights are in no way affected by the above.
          ******************************************************************************/
          if (!hs) { var hs = {
          // Language strings
          lang : {
          	cssDirection: 'ltr',
          	loadingText : 'Loading...',
          	loadingTitle : 'Click to cancel',
          	focusTitle : 'Click to bring to front',
          	fullExpandTitle : 'Expand to actual size (f)',
          	creditsText : 'Powered by <i>Highslide JS</i>',
          	creditsTitle : 'Go to the Highslide JS homepage',
          	restoreTitle : 'Click to close image, click and drag to move. Use arrow keys for next and previous.'
          },
          // See http://highslide.com/ref for examples of settings  
          graphicsDir : 'highslide/graphics/',
          expandCursor : 'zoomin.cur', // null disables
          restoreCursor : 'zoomout.cur', // null disables
          expandDuration : 250, // milliseconds
          restoreDuration : 250,
          marginLeft : 15,
          marginRight : 15,
          marginTop : 15,
          marginBottom : 15,
          zIndexCounter : 1001, // adjust to other absolutely positioned elements
          loadingOpacity : 0.75,
          allowMultipleInstances: true,
          numberOfImagesToPreload : 5,
          outlineWhileAnimating : 2, // 0 = never, 1 = always, 2 = HTML only 
          outlineStartOffset : 3, // ends at 10
          padToMinWidth : false, // pad the popup width to make room for wide caption
          fullExpandPosition : 'bottom right',
          fullExpandOpacity : 1,
          showCredits : true, // you can set this to false if you want
          creditsHref : 'http://highslide.com/',
          creditsTarget : '_self',
          enableKeyListener : true,
          openerTagNames : ['a'], // Add more to allow slideshow indexing
          
          dragByHeading: true,
          minWidth: 200,
          minHeight: 200,
          allowSizeReduction: true, // allow the image to reduce to fit client size. If false, this overrides minWidth and minHeight
          outlineType : 'drop-shadow', // set null to disable outlines
          // END OF YOUR SETTINGS
          
          
          // declare internal properties
          preloadTheseImages : [],
          continuePreloading: true,
          expanders : [],
          overrides : [
          	'allowSizeReduction',
          	'useBox',
          	'outlineType',
          	'outlineWhileAnimating',
          	'captionId',
          	'captionText',
          	'captionEval',
          	'captionOverlay',
          	'headingId',
          	'headingText',
          	'headingEval',
          	'headingOverlay',
          	'creditsPosition',
          	'dragByHeading',
          	
          	'width',
          	'height',
          	
          	'wrapperClassName',
          	'minWidth',
          	'minHeight',
          	'maxWidth',
          	'maxHeight',
          	'slideshowGroup',
          	'easing',
          	'easingClose',
          	'fadeInOut',
          	'src'
          ],
          overlays : [],
          idCounter : 0,
          oPos : {
          	x: ['leftpanel', 'left', 'center', 'right', 'rightpanel'],
          	y: ['above', 'top', 'middle', 'bottom', 'below']
          },
          mouse: {},
          headingOverlay: {},
          captionOverlay: {},
          timers : [],
          
          pendingOutlines : {},
          clones : {},
          onReady: [],
          uaVersion: /Trident\/4\.0/.test(navigator.userAgent) ? 8 :
          	parseFloat((navigator.userAgent.toLowerCase().match( /.+(?:rv|it|ra|ie)[\/: ]([\d.]+)/ ) || [0,'0'])[1]),
          ie : (document.all && !window.opera),
          safari : /Safari/.test(navigator.userAgent),
          geckoMac : /Macintosh.+rv:1\.[0-8].+Gecko/.test(navigator.userAgent),
          
          $ : function (id) {
          	if (id) return document.getElementById(id);
          },
          
          push : function (arr, val) {
          	arr[arr.length] = val;
          },
          
          createElement : function (tag, attribs, styles, parent, nopad) {
          	var el = document.createElement(tag);
          	if (attribs) hs.extend(el, attribs);
          	if (nopad) hs.setStyles(el, {padding: 0, border: 'none', margin: 0});
          	if (styles) hs.setStyles(el, styles);
          	if (parent) parent.appendChild(el);	
          	return el;
          },
          
          extend : function (el, attribs) {
          	for (var x in attribs) el[x] = attribs[x];
          	return el;
          },
          
          setStyles : function (el, styles) {
          	for (var x in styles) {
          		if (hs.ie && x == 'opacity') {
          			if (styles[x] > 0.99) el.style.removeAttribute('filter');
          			else el.style.filter = 'alpha(opacity='+ (styles[x] * 100) +')';
          		}
          		else el.style[x] = styles[x];
          	}
          },
          animate: function(el, prop, opt) {
          	var start,
          		end,
          		unit;
          	if (typeof opt != 'object' || opt === null) {
          		var args = arguments;
          		opt = {
          			duration: args[2],
          			easing: args[3],
          			complete: args[4]
          		};
          	}
          	if (typeof opt.duration != 'number') opt.duration = 250;
          	opt.easing = Math[opt.easing] || Math.easeInQuad;
          	opt.curAnim = hs.extend({}, prop);
          	for (var name in prop) {
          		var e = new hs.fx(el, opt , name );
          		
          		start = parseFloat(hs.css(el, name)) || 0;
          		end = parseFloat(prop[name]);
          		unit = name != 'opacity' ? 'px' : '';
          		
          		e.custom( start, end, unit );
          	}	
          },
          css: function(el, prop) {
          	if (document.defaultView) {
          		return document.defaultView.getComputedStyle(el, null).getPropertyValue(prop);
          
          	} else {
          		if (prop == 'opacity') prop = 'filter';
          		var val = el.currentStyle[prop.replace(/\-(\w)/g, function (a, b){ return b.toUpperCase(); })];
          		if (prop == 'filter') 
          			val = val.replace(/alpha\(opacity=([0-9]+)\)/, 
          				function (a, b) { return b / 100 });
          		return val === '' ? 1 : val;
          	} 
          },
          
          getPageSize : function () {
          	var d = document, w = window, iebody = d.compatMode && d.compatMode != 'BackCompat' 
          		? d.documentElement : d.body;
          	
          	var width = hs.ie ? iebody.clientWidth : 
          			(d.documentElement.clientWidth || self.innerWidth),
          		height = hs.ie ? iebody.clientHeight : self.innerHeight;
          	
          	hs.page = {
          		width: width,
          		height: height,		
          		scrollLeft: hs.ie ? iebody.scrollLeft : pageXOffset,
          		scrollTop: hs.ie ? iebody.scrollTop : pageYOffset
          	}
          },
          
          getPosition : function(el)	{
          	var p = { x: el.offsetLeft, y: el.offsetTop };
          	while (el.offsetParent)	{
          		el = el.offsetParent;
          		p.x += el.offsetLeft;
          		p.y += el.offsetTop;
          		if (el != document.body && el != document.documentElement) {
          			p.x -= el.scrollLeft;
          			p.y -= el.scrollTop;
          		}
          	}
          	return p;
          },
          
          expand : function(a, params, custom, type) {
          	if (!a) a = hs.createElement('a', null, { display: 'none' }, hs.container);
          	if (typeof a.getParams == 'function') return params;	
          	try {	
          		new hs.Expander(a, params, custom);
          		return false;
          	} catch (e) { return true; }
          },
          
          
          focusTopmost : function() {
          	var topZ = 0, 
          		topmostKey = -1,
          		expanders = hs.expanders,
          		exp,
          		zIndex;
          	for (var i = 0; i < expanders.length; i++) {
          		exp = expanders[i];
          		if (exp) {
          			zIndex = exp.wrapper.style.zIndex;
          			if (zIndex && zIndex > topZ) {
          				topZ = zIndex;				
          				topmostKey = i;
          			}
          		}
          	}
          	if (topmostKey == -1) hs.focusKey = -1;
          	else expanders[topmostKey].focus();
          },
          
          getParam : function (a, param) {
          	a.getParams = a.onclick;
          	var p = a.getParams ? a.getParams() : null;
          	a.getParams = null;
          	
          	return (p && typeof p[param] != 'undefined') ? p[param] : 
          		(typeof hs[param] != 'undefined' ? hs[param] : null);
          },
          
          getSrc : function (a) {
          	var src = hs.getParam(a, 'src');
          	if (src) return src;
          	return a.href;
          },
          
          getNode : function (id) {
          	var node = hs.$(id), clone = hs.clones[id], a = {};
          	if (!node && !clone) return null;
          	if (!clone) {
          		clone = node.cloneNode(true);
          		clone.id = '';
          		hs.clones[id] = clone;
          		return node;
          	} else {
          		return clone.cloneNode(true);
          	}
          },
          
          discardElement : function(d) {
          	if (d) hs.garbageBin.appendChild(d);
          	hs.garbageBin.innerHTML = '';
          },
          transit : function (adj, exp) {
          	var last = exp = exp || hs.getExpander();
          	if (hs.upcoming) return false;
          	else hs.last = last;
          	try {
          		hs.upcoming = adj;
          		adj.onclick(); 		
          	} catch (e){
          		hs.last = hs.upcoming = null;
          	}
          	try {
          		exp.close();
          	} catch (e) {}
          	return false;
          },
          
          previousOrNext : function (el, op) {
          	var exp = hs.getExpander(el);
          	if (exp) return hs.transit(exp.getAdjacentAnchor(op), exp);
          	else return false;
          },
          
          previous : function (el) {
          	return hs.previousOrNext(el, -1);
          },
          
          next : function (el) {
          	return hs.previousOrNext(el, 1);	
          },
          
          keyHandler : function(e) {
          	if (!e) e = window.event;
          	if (!e.target) e.target = e.srcElement; // ie
          	if (typeof e.target.form != 'undefined') return true; // form element has focus
          	var exp = hs.getExpander();
          	
          	var op = null;
          	switch (e.keyCode) {
          		case 70: // f
          			if (exp) exp.doFullExpand();
          			return true;
          		case 32: // Space
          		case 34: // Page Down
          		case 39: // Arrow right
          		case 40: // Arrow down
          			op = 1;
          			break;
          		case 8:  // Backspace
          		case 33: // Page Up
          		case 37: // Arrow left
          		case 38: // Arrow up
          			op = -1;
          			break;
          		case 27: // Escape
          		case 13: // Enter
          			op = 0;
          	}
          	if (op !== null) {hs.removeEventListener(document, window.opera ? 'keypress' : 'keydown', hs.keyHandler);
          		if (!hs.enableKeyListener) return true;
          		
          		if (e.preventDefault) e.preventDefault();
              	else e.returnValue = false;
              	if (exp) {
          			if (op == 0) {
          				exp.close();
          			} else {
          				hs.previousOrNext(exp.key, op);
          			}
          			return false;
          		}
          	}
          	return true;
          },
          
          
          registerOverlay : function (overlay) {
          	hs.push(hs.overlays, hs.extend(overlay, { hsId: 'hsId'+ hs.idCounter++ } ));
          },
          
          
          getWrapperKey : function (element, expOnly) {
          	var el, re = /^highslide-wrapper-([0-9]+)$/;
          	// 1. look in open expanders
          	el = element;
          	while (el.parentNode)	{
          		if (el.id && re.test(el.id)) return el.id.replace(re, "$1");
          		el = el.parentNode;
          	}
          	// 2. look in thumbnail
          	if (!expOnly) {
          		el = element;
          		while (el.parentNode)	{
          			if (el.tagName && hs.isHsAnchor(el)) {
          				for (var key = 0; key < hs.expanders.length; key++) {
          					var exp = hs.expanders[key];
          					if (exp && exp.a == el) return key;
          				}
          			}
          			el = el.parentNode;
          		}
          	}
          	return null; 
          },
          
          getExpander : function (el, expOnly) {
          	if (typeof el == 'undefined') return hs.expanders[hs.focusKey] || null;
          	if (typeof el == 'number') return hs.expanders[el] || null;
          	if (typeof el == 'string') el = hs.$(el);
          	return hs.expanders[hs.getWrapperKey(el, expOnly)] || null;
          },
          
          isHsAnchor : function (a) {
          	return (a.onclick && a.onclick.toString().replace(/\s/g, ' ').match(/hs.(htmlE|e)xpand/));
          },
          
          reOrder : function () {
          	for (var i = 0; i < hs.expanders.length; i++)
          		if (hs.expanders[i] && hs.expanders[i].isExpanded) hs.focusTopmost();
          },
          
          mouseClickHandler : function(e) 
          {	
          	if (!e) e = window.event;
          	if (e.button > 1) return true;
          	if (!e.target) e.target = e.srcElement;
          	
          	var el = e.target;
          	while (el.parentNode
          		&& !(/highslide-(image|move|html|resize)/.test(el.className)))
          	{
          		el = el.parentNode;
          	}
          	var exp = hs.getExpander(el);
          	if (exp && (exp.isClosing || !exp.isExpanded)) return true;
          		
          	if (exp && e.type == 'mousedown') {
          		if (e.target.form) return true;
          		var match = el.className.match(/highslide-(image|move|resize)/);
          		if (match) {
          			hs.dragArgs = { 
          				exp: exp , 
          				type: match[1], 
          				left: exp.x.pos, 
          				width: exp.x.size, 
          				top: exp.y.pos, 
          				height: exp.y.size, 
          				clickX: e.clientX, 
          				clickY: e.clientY
          			};
          			
          			
          			hs.addEventListener(document, 'mousemove', hs.dragHandler);
          			if (e.preventDefault) e.preventDefault(); // FF
          			
          			if (/highslide-(image|html)-blur/.test(exp.content.className)) {
          				exp.focus();
          				hs.hasFocused = true;
          			}
          			return false;
          		}
          	} else if (e.type == 'mouseup') {
          		
          		hs.removeEventListener(document, 'mousemove', hs.dragHandler);
          		
          		if (hs.dragArgs) {
          			if (hs.styleRestoreCursor && hs.dragArgs.type == 'image') 
          				hs.dragArgs.exp.content.style.cursor = hs.styleRestoreCursor;
          			var hasDragged = hs.dragArgs.hasDragged;
          			
          			if (!hasDragged &&!hs.hasFocused && !/(move|resize)/.test(hs.dragArgs.type)) {
          				exp.close();
          			} 
          			else if (hasDragged || (!hasDragged && hs.hasHtmlExpanders)) {
          				hs.dragArgs.exp.doShowHide('hidden');
          			}
          			hs.hasFocused = false;
          			hs.dragArgs = null;
          		
          		} else if (/highslide-image-blur/.test(el.className)) {
          			el.style.cursor = hs.styleRestoreCursor;		
          		}
          	}
          	return false;
          },
          
          dragHandler : function(e)
          {
          	if (!hs.dragArgs) return true;
          	if (!e) e = window.event;
          	var a = hs.dragArgs, exp = a.exp;
          	
          	a.dX = e.clientX - a.clickX;
          	a.dY = e.clientY - a.clickY;	
          	
          	var distance = Math.sqrt(Math.pow(a.dX, 2) + Math.pow(a.dY, 2));
          	if (!a.hasDragged) a.hasDragged = (a.type != 'image' && distance > 0)
          		|| (distance > (hs.dragSensitivity || 5));
          	
          	if (a.hasDragged && e.clientX > 5 && e.clientY > 5) {
          		
          		if (a.type == 'resize') exp.resize(a);
          		else {
          			exp.moveTo(a.left + a.dX, a.top + a.dY);
          			if (a.type == 'image') exp.content.style.cursor = 'move';
          		}
          	}
          	return false;
          },
          
          wrapperMouseHandler : function (e) {
          	try {
          		if (!e) e = window.event;
          		var over = /mouseover/i.test(e.type); 
          		if (!e.target) e.target = e.srcElement; // ie
          		if (hs.ie) e.relatedTarget = 
          			over ? e.fromElement : e.toElement; // ie
          		var exp = hs.getExpander(e.target);
          		if (!exp.isExpanded) return;
          		if (!exp || !e.relatedTarget || hs.getExpander(e.relatedTarget, true) == exp 
          			|| hs.dragArgs) return;
          		for (var i = 0; i < exp.overlays.length; i++) (function() {
          			var o = hs.$('hsId'+ exp.overlays[i]);
          			if (o && o.hideOnMouseOut) {
          				if (over) hs.setStyles(o, { visibility: 'visible', display: '' });
          				hs.animate(o, { opacity: over ? o.opacity : 0 }, o.dur);
          			}
          		})();	
          	} catch (e) {}
          },
          addEventListener : function (el, event, func) {
          	if (el == document && event == 'ready') hs.push(hs.onReady, func);
          	try {
          		el.addEventListener(event, func, false);
          	} catch (e) {
          		try {
          			el.detachEvent('on'+ event, func);
          			el.attachEvent('on'+ event, func);
          		} catch (e) {
          			el['on'+ event] = func;
          		}
          	} 
          },
          
          removeEventListener : function (el, event, func) {
          	try {
          		el.removeEventListener(event, func, false);
          	} catch (e) {
          		try {
          			el.detachEvent('on'+ event, func);
          		} catch (e) {
          			el['on'+ event] = null;
          		}
          	}
          },
          
          preloadFullImage : function (i) {
          	if (hs.continuePreloading && hs.preloadTheseImages[i] && hs.preloadTheseImages[i] != 'undefined') {
          		var img = document.createElement('img');
          		img.onload = function() { 
          			img = null;
          			hs.preloadFullImage(i + 1);
          		};
          		img.src = hs.preloadTheseImages[i];
          	}
          },
          preloadImages : function (number) {
          	if (number && typeof number != 'object') hs.numberOfImagesToPreload = number;
          	
          	var arr = hs.getAnchors();
          	for (var i = 0; i < arr.images.length && i < hs.numberOfImagesToPreload; i++) {
          		hs.push(hs.preloadTheseImages, hs.getSrc(arr.images[i]));
          	}
          	
          	// preload outlines
          	if (hs.outlineType)	new hs.Outline(hs.outlineType, function () { hs.preloadFullImage(0)} );
          	else
          	
          	hs.preloadFullImage(0);
          	
          	// preload cursor
          	if (hs.restoreCursor) var cur = hs.createElement('img', { src: hs.graphicsDir + hs.restoreCursor });
          },
          
          
          init : function () {
          	if (!hs.container) {
          	
          		hs.getPageSize();
          		hs.ieLt7 = hs.ie && hs.uaVersion < 7;
          		for (var x in hs.langDefaults) {
          			if (typeof hs[x] != 'undefined') hs.lang[x] = hs[x];
          			else if (typeof hs.lang[x] == 'undefined' && typeof hs.langDefaults[x] != 'undefined') 
          				hs.lang[x] = hs.langDefaults[x];
          		}
          		
          		hs.container = hs.createElement('div', {
          				className: 'highslide-container'
          			}, {
          				position: 'absolute', 
          				left: 0, 
          				top: 0, 
          				width: '100%', 
          				zIndex: hs.zIndexCounter,
          				direction: 'ltr'
          			}, 
          			document.body,
          			true
          		);
          		hs.loading = hs.createElement('a', {
          				className: 'highslide-loading',
          				title: hs.lang.loadingTitle,
          				innerHTML: hs.lang.loadingText,
          				href: 'javascript:;'
          			}, {
          				position: 'absolute',
          				top: '-9999px',
          				opacity: hs.loadingOpacity,
          				zIndex: 1
          			}, hs.container
          		);
          		hs.garbageBin = hs.createElement('div', null, { display: 'none' }, hs.container);
          		
          		// http://www.robertpenner.com/easing/ 
          		Math.linearTween = function (t, b, c, d) {
          			return c*t/d + b;
          		};
          		Math.easeInQuad = function (t, b, c, d) {
          			return c*(t/=d)*t + b;
          		};
          		
          		hs.hideSelects = hs.ieLt7;
          		hs.hideIframes = ((window.opera && hs.uaVersion < 9) || navigator.vendor == 'KDE' 
          			|| (hs.ie && hs.uaVersion < 5.5));
          	}
          },
          ready : function() {
          	if (hs.isReady) return;
          	hs.isReady = true;
          	
          	for (var i = 0; i < hs.onReady.length; i++) hs.onReady[i]();
          },
          
          updateAnchors : function() {
          	var el, els, all = [], images = [],groups = {}, re;
          		
          	for (var i = 0; i < hs.openerTagNames.length; i++) {
          		els = document.getElementsByTagName(hs.openerTagNames[i]);
          		for (var j = 0; j < els.length; j++) {
          			el = els[j];
          			re = hs.isHsAnchor(el);
          			if (re) {
          				hs.push(all, el);
          				if (re[0] == 'hs.expand') hs.push(images, el);
          				var g = hs.getParam(el, 'slideshowGroup') || 'none';
          				if (!groups[g]) groups[g] = [];
          				hs.push(groups[g], el);
          			}
          		}
          	}
          	hs.anchors = { all: all, groups: groups, images: images };
          	return hs.anchors;
          	
          },
          
          getAnchors : function() {
          	return hs.anchors || hs.updateAnchors();
          },
          
          
          close : function(el) {
          	var exp = hs.getExpander(el);
          	if (exp) exp.close();
          	return false;
          }
          }; // end hs object
          hs.fx = function( elem, options, prop ){
          	this.options = options;
          	this.elem = elem;
          	this.prop = prop;
          
          	if (!options.orig) options.orig = {};
          };
          hs.fx.prototype = {
          	update: function(){
          		(hs.fx.step[this.prop] || hs.fx.step._default)(this);
          		
          		if (this.options.step)
          			this.options.step.call(this.elem, this.now, this);
          
          	},
          	custom: function(from, to, unit){
          		this.startTime = (new Date()).getTime();
          		this.start = from;
          		this.end = to;
          		this.unit = unit;// || this.unit || "px";
          		this.now = this.start;
          		this.pos = this.state = 0;
          
          		var self = this;
          		function t(gotoEnd){
          			return self.step(gotoEnd);
          		}
          
          		t.elem = this.elem;
          
          		if ( t() && hs.timers.push(t) == 1 ) {
          			hs.timerId = setInterval(function(){
          				var timers = hs.timers;
          
          				for ( var i = 0; i < timers.length; i++ )
          					if ( !timers[i]() )
          						timers.splice(i--, 1);
          
          				if ( !timers.length ) {
          					clearInterval(hs.timerId);
          				}
          			}, 13);
          		}
          	},
          	step: function(gotoEnd){
          		var t = (new Date()).getTime();
          		if ( gotoEnd || t >= this.options.duration + this.startTime ) {
          			this.now = this.end;
          			this.pos = this.state = 1;
          			this.update();
          
          			this.options.curAnim[ this.prop ] = true;
          
          			var done = true;
          			for ( var i in this.options.curAnim )
          				if ( this.options.curAnim[i] !== true )
          					done = false;
          
          			if ( done ) {
          				if (this.options.complete) this.options.complete.call(this.elem);
          			}
          			return false;
          		} else {
          			var n = t - this.startTime;
          			this.state = n / this.options.duration;
          			this.pos = this.options.easing(n, 0, 1, this.options.duration);
          			this.now = this.start + ((this.end - this.start) * this.pos);
          			this.update();
          		}
          		return true;
          	}
          
          };
          
          hs.extend( hs.fx, {
          	step: {
          
          		opacity: function(fx){
          			hs.setStyles(fx.elem, { opacity: fx.now });
          		},
          
          		_default: function(fx){
          			try {
          				if ( fx.elem.style && fx.elem.style[ fx.prop ] != null )
          					fx.elem.style[ fx.prop ] = fx.now + fx.unit;
          				else
          					fx.elem[ fx.prop ] = fx.now;
          			} catch (e) {}
          		}
          	}
          });
          
          hs.Outline =  function (outlineType, onLoad) {
          	this.onLoad = onLoad;
          	this.outlineType = outlineType;
          	var v = hs.uaVersion, tr;
          	
          	this.hasAlphaImageLoader = hs.ie && v >= 5.5 && v < 7;
          	if (!outlineType) {
          		if (onLoad) onLoad();
          		return;
          	}
          	
          	hs.init();
          	this.table = hs.createElement(
          		'table', { 
          			cellSpacing: 0 
          		}, {
          			visibility: 'hidden',
          			position: 'absolute',
          			borderCollapse: 'collapse',
          			width: 0
          		},
          		hs.container,
          		true
          	);
          	var tbody = hs.createElement('tbody', null, null, this.table, 1);
          	
          	this.td = [];
          	for (var i = 0; i <= 8; i++) {
          		if (i % 3 == 0) tr = hs.createElement('tr', null, { height: 'auto' }, tbody, true);
          		this.td[i] = hs.createElement('td', null, null, tr, true);
          		var style = i != 4 ? { lineHeight: 0, fontSize: 0} : { position : 'relative' };
          		hs.setStyles(this.td[i], style);
          	}
          	this.td[4].className = outlineType +' highslide-outline';
          	
          	this.preloadGraphic(); 
          };
          
          hs.Outline.prototype = {
          preloadGraphic : function () {
          	var src = hs.graphicsDir + (hs.outlinesDir || "outlines/")+ this.outlineType +".png";
          				
          	var appendTo = hs.safari ? hs.container : null;
          	this.graphic = hs.createElement('img', null, { position: 'absolute', 
          		top: '-9999px' }, appendTo, true); // for onload trigger
          	
          	var pThis = this;
          	this.graphic.onload = function() { pThis.onGraphicLoad(); };
          	
          	this.graphic.src = src;
          },
          
          onGraphicLoad : function () {
          	var o = this.offset = this.graphic.width / 4,
          		pos = [[0,0],[0,-4],[-2,0],[0,-8],0,[-2,-8],[0,-2],[0,-6],[-2,-2]],
          		dim = { height: (2*o) +'px', width: (2*o) +'px' };
          	for (var i = 0; i <= 8; i++) {
          		if (pos[i]) {
          			if (this.hasAlphaImageLoader) {
          				var w = (i == 1 || i == 7) ? '100%' : this.graphic.width +'px';
          				var div = hs.createElement('div', null, { width: '100%', height: '100%', position: 'relative', overflow: 'hidden'}, this.td[i], true);
          				hs.createElement ('div', null, { 
          						filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale, src='"+ this.graphic.src + "')", 
          						position: 'absolute',
          						width: w, 
          						height: this.graphic.height +'px',
          						left: (pos[i][0]*o)+'px',
          						top: (pos[i][1]*o)+'px'
          					}, 
          				div,
          				true);
          			} else {
          				hs.setStyles(this.td[i], { background: 'url('+ this.graphic.src +') '+ (pos[i][0]*o)+'px '+(pos[i][1]*o)+'px'});
          			}
          			
          			if (window.opera && (i == 3 || i ==5)) 
          				hs.createElement('div', null, dim, this.td[i], true);
          			
          			hs.setStyles (this.td[i], dim);
          		}
          	}
          	this.graphic = null;
          	if (hs.pendingOutlines[this.outlineType]) hs.pendingOutlines[this.outlineType].destroy();
          	hs.pendingOutlines[this.outlineType] = this;
          	if (this.onLoad) this.onLoad();
          },
          	
          setPosition : function (pos, offset, vis, dur, easing) {
          	var exp = this.exp,
          		stl = exp.wrapper.style,
          		offset = offset || 0,
          		pos = pos || {
          			x: exp.x.pos + offset,
          			y: exp.y.pos + offset,
          			w: exp.x.get('wsize') - 2 * offset,
          			h: exp.y.get('wsize') - 2 * offset
          		};
          	if (vis) this.table.style.visibility = (pos.h >= 4 * this.offset) 
          		? 'visible' : 'hidden';
          	hs.setStyles(this.table, {
          		left: (pos.x - this.offset) +'px',
          		top: (pos.y - this.offset) +'px',
          		width: (pos.w + 2 * this.offset) +'px'
          	});
          	
          	pos.w -= 2 * this.offset;
          	pos.h -= 2 * this.offset;
          	hs.setStyles (this.td[4], {
          		width: pos.w >= 0 ? pos.w +'px' : 0,
          		height: pos.h >= 0 ? pos.h +'px' : 0
          	});
          	if (this.hasAlphaImageLoader) this.td[3].style.height 
          		= this.td[5].style.height = this.td[4].style.height;	
          	
          },
          	
          destroy : function(hide) {
          	if (hide) this.table.style.visibility = 'hidden';
          	else hs.discardElement(this.table);
          }
          };
          
          hs.Dimension = function(exp, dim) {
          	this.exp = exp;
          	this.dim = dim;
          	this.ucwh = dim == 'x' ? 'Width' : 'Height';
          	this.wh = this.ucwh.toLowerCase();
          	this.uclt = dim == 'x' ? 'Left' : 'Top';
          	this.lt = this.uclt.toLowerCase();
          	this.ucrb = dim == 'x' ? 'Right' : 'Bottom';
          	this.rb = this.ucrb.toLowerCase();
          	this.p1 = this.p2 = 0;
          };
          hs.Dimension.prototype = {
          get : function(key) {
          	switch (key) {
          		case 'loadingPos':
          			return this.tpos + this.tb + (this.t - hs.loading['offset'+ this.ucwh]) / 2;
          		case 'wsize':
          			return this.size + 2 * this.cb + this.p1 + this.p2;
          		case 'fitsize':
          			return this.clientSize - this.marginMin - this.marginMax;
          		case 'maxsize':
          			return this.get('fitsize') - 2 * this.cb - this.p1 - this.p2 ;
          		case 'opos':
          			return this.pos - (this.exp.outline ? this.exp.outline.offset : 0);
          		case 'osize':
          			return this.get('wsize') + (this.exp.outline ? 2*this.exp.outline.offset : 0);
          		case 'imgPad':
          			return this.imgSize ? Math.round((this.size - this.imgSize) / 2) : 0;
          		
          	}
          },
          calcBorders: function() {
          	// correct for borders
          	this.cb = (this.exp.content['offset'+ this.ucwh] - this.t) / 2;
          	
          	this.marginMax = hs['margin'+ this.ucrb];
          },
          calcThumb: function() {
          	this.t = this.exp.el[this.wh] ? parseInt(this.exp.el[this.wh]) : 
          		this.exp.el['offset'+ this.ucwh];
          	this.tpos = this.exp.tpos[this.dim];
          	this.tb = (this.exp.el['offset'+ this.ucwh] - this.t) / 2;
          	if (this.tpos == 0 || this.tpos == -1) {
          		this.tpos = (hs.page[this.wh] / 2) + hs.page['scroll'+ this.uclt];		
          	};
          },
          calcExpanded: function() {
          	var exp = this.exp;
          	this.justify = 'auto';
          	
          	
          	// size and position
          	this.pos = this.tpos - this.cb + this.tb;
          	
          	if (this.maxHeight && this.dim == 'x')
          		exp.maxWidth = Math.min(exp.maxWidth || this.full, exp.maxHeight * this.full / exp.y.full); 
          		
          	this.size = Math.min(this.full, exp['max'+ this.ucwh] || this.full);
          	this.minSize = exp.allowSizeReduction ? 
          		Math.min(exp['min'+ this.ucwh], this.full) :this.full;
          	if (exp.isImage && exp.useBox)	{
          		this.size = exp[this.wh];
          		this.imgSize = this.full;
          	}
          	if (this.dim == 'x' && hs.padToMinWidth) this.minSize = exp.minWidth;
          	this.marginMin = hs['margin'+ this.uclt];
          	this.scroll = hs.page['scroll'+ this.uclt];
          	this.clientSize = hs.page[this.wh];
          },
          setSize: function(i) {
          	var exp = this.exp;
          	if (exp.isImage && (exp.useBox || hs.padToMinWidth)) {
          		this.imgSize = i;
          		this.size = Math.max(this.size, this.imgSize);
          		exp.content.style[this.lt] = this.get('imgPad')+'px';
          	} else
          	this.size = i;
          	
          	exp.content.style[this.wh] = i +'px';
          	exp.wrapper.style[this.wh] = this.get('wsize') +'px';
          	if (exp.outline) exp.outline.setPosition();
          	if (this.dim == 'x' && exp.overlayBox) exp.sizeOverlayBox(true);
          },
          setPos: function(i) {
          	this.pos = i;
          	this.exp.wrapper.style[this.lt] = i +'px';	
          	
          	if (this.exp.outline) this.exp.outline.setPosition();
          	
          }
          };
          
          hs.Expander = function(a, params, custom, contentType) {
          	if (document.readyState && hs.ie && !hs.isReady) {
          		hs.addEventListener(document, 'ready', function() {
          			new hs.Expander(a, params, custom, contentType);
          		});
          		return;
          	} 
          	this.a = a;
          	this.custom = custom;
          	this.contentType = contentType || 'image';
          	this.isImage = !this.isHtml;
          	
          	hs.continuePreloading = false;
          	this.overlays = [];
          	hs.init();
          	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];
          	}
          	if (!this.src) this.src = a.href;
          	
          	// get thumb
          	var el = (params && params.thumbnailId) ? hs.$(params.thumbnailId) : a;
          	el = this.thumb = el.getElementsByTagName('img')[0] || el;
          	this.thumbsUserSetId = el.id || a.id;
          	
          	// 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
          	if (!hs.allowSimultaneousLoading) 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[key] = this;
          	if (!hs.allowMultipleInstances && !hs.upcoming) {
          		if (hs.expanders[key-1]) hs.expanders[key-1].close();
          		if (typeof hs.focusKey != 'undefined' && hs.expanders[hs.focusKey])
          			hs.expanders[hs.focusKey].close();
          	}
          	
          	// initiate metrics
          	this.el = el;
          	this.tpos = hs.getPosition(el);
          	hs.getPageSize();
          	var x = this.x = new hs.Dimension(this, 'x');
          	x.calcThumb();
          	var y = this.y = new hs.Dimension(this, 'y');
          	y.calcThumb();
          	this.wrapper = hs.createElement(
          		'div', {
          			id: 'highslide-wrapper-'+ this.key,
          			className: 'highslide-wrapper '+ this.wrapperClassName
          		}, {
          			visibility: 'hidden',
          			position: 'absolute',
          			zIndex: hs.zIndexCounter += 2
          		}, null, true );
          	
          	this.wrapper.onmouseover = this.wrapper.onmouseout = hs.wrapperMouseHandler;
          	if (this.contentType == 'image' && this.outlineWhileAnimating == 2)
          		this.outlineWhileAnimating = 0;
          	
          	// get the outline
          	if (!this.outlineType) {
          		this[this.contentType +'Create']();
          	
          	} else if (hs.pendingOutlines[this.outlineType]) {
          		this.connectOutline();
          		this[this.contentType +'Create']();
          	
          	} else {
          		this.showLoading();
          		var exp = this;
          		new hs.Outline(this.outlineType, 
          			function () {
          				exp.connectOutline();
          				exp[exp.contentType +'Create']();
          			} 
          		);
          	}
          	return true;
          };
          
          hs.Expander.prototype = {
          error : function(e) {
          	// alert ('Line '+ e.lineNumber +': '+ e.message);
          	window.location.href = this.src;
          },
          
          connectOutline : function() {
          	var outline = this.outline = hs.pendingOutlines[this.outlineType];
          	outline.exp = this;
          	outline.table.style.zIndex = this.wrapper.style.zIndex - 1;
          	hs.pendingOutlines[this.outlineType] = null;
          },
          
          showLoading : function() {
          	if (this.onLoadStarted || this.loading) return;
          	
          	this.loading = hs.loading;
          	var exp = this;
          	this.loading.onclick = function() {
          		exp.cancelLoading();
          	};
          	var exp = this, 
          		l = this.x.get('loadingPos') +'px',
          		t = this.y.get('loadingPos') +'px';
          	setTimeout(function () { 
          		if (exp.loading) hs.setStyles(exp.loading, { left: l, top: t, zIndex: hs.zIndexCounter++ })}
          	, 100);
          },
          
          imageCreate : function() {
          	var exp = this;
          	
          	var img = document.createElement('img');
              this.content = img;
              img.onload = function () {
              	if (hs.expanders[exp.key]) exp.contentLoaded(); 
          	};
              if (hs.blockRightClick) img.oncontextmenu = function() { return false; };
              img.className = 'highslide-image';
              hs.setStyles(img, {
              	visibility: 'hidden',
              	display: 'block',
              	position: 'absolute',
          		maxWidth: '9999px',
          		zIndex: 3
          	});
              img.title = hs.lang.restoreTitle;
              if (hs.safari) hs.container.appendChild(img);
              if (hs.ie && hs.flushImgSize) img.src = null;
          	img.src = this.src;
          	
          	this.showLoading();
          },
          
          contentLoaded : function() {
          	try {	
          		if (!this.content) return;
          		this.content.onload = null;
          		if (this.onLoadStarted) return;
          		else this.onLoadStarted = true;
          		
          		var x = this.x, y = this.y;
          		
          		if (this.loading) {
          			hs.setStyles(this.loading, { top: '-9999px' });
          			this.loading = null;
          		}	
          			x.full = this.content.width;
          			y.full = this.content.height;
          			
          			hs.setStyles(this.content, {
          				width: x.t +'px',
          				height: y.t +'px'
          			});
          			this.wrapper.appendChild(this.content);
          			hs.container.appendChild(this.wrapper);
          		
          		x.calcBorders();
          		y.calcBorders();
          		
          		hs.setStyles (this.wrapper, {
          			left: (x.tpos + x.tb - x.cb) +'px',
          			top: (y.tpos + x.tb - y.cb) +'px'
          		});
          		this.getOverlays();
          		
          		var ratio = x.full / y.full;
          		x.calcExpanded();
          		this.justify(x);
          		
          		y.calcExpanded();
          		this.justify(y);
          		if (this.overlayBox) this.sizeOverlayBox(0, 1);
          
          		
          		if (this.allowSizeReduction) {
          				this.correctRatio(ratio);
          			if (this.isImage && this.x.full > (this.x.imgSize || this.x.size)) {
          				this.createFullExpand();
          				if (this.overlays.length == 1) this.sizeOverlayBox();
          			}
          		}
          		this.show();
          		
          	} catch (e) {
          		this.error(e);
          	}
          },
          
          justify : function (p, moveOnly) {
          	var tgtArr, tgt = p.target, dim = p == this.x ? 'x' : 'y';
          	
          		var hasMovedMin = false;
          		
          		var allowReduce = p.exp.allowSizeReduction;
          			p.pos = Math.round(p.pos - ((p.get('wsize') - p.t) / 2));
          		if (p.pos < p.scroll + p.marginMin) {
          			p.pos = p.scroll + p.marginMin;
          			hasMovedMin = true;		
          		}
          		if (!moveOnly && p.size < p.minSize) {
          			p.size = p.minSize;
          			allowReduce = false;
          		}
          		if (p.pos + p.get('wsize') > p.scroll + p.clientSize - p.marginMax) {
          			if (!moveOnly && hasMovedMin && allowReduce) {
          				p.size = Math.min(p.size, p.get(dim == 'y' ? 'fitsize' : 'maxsize'));
          			} else if (p.get('wsize') < p.get('fitsize')) {
          				p.pos = p.scroll + p.clientSize - p.marginMax - p.get('wsize');
          			} else { // image larger than viewport
          				p.pos = p.scroll + p.marginMin;
          				if (!moveOnly && allowReduce) p.size = p.get(dim == 'y' ? 'fitsize' : 'maxsize');
          			}			
          		}
          		
          		if (!moveOnly && p.size < p.minSize) {
          			p.size = p.minSize;
          			allowReduce = false;
          		}
          		
          	
          		
          	if (p.pos < p.marginMin) {
          		var tmpMin = p.pos;
          		p.pos = p.marginMin; 
          		
          		if (allowReduce && !moveOnly) p.size = p.size - (p.pos - tmpMin);
          		
          	}
          },
          
          correctRatio : function(ratio) {
          	var x = this.x, 
          		y = this.y,
          		changed = false,
          		xSize = Math.min(x.full, x.size),
          		ySize = Math.min(y.full, y.size),
          		useBox = (this.useBox || hs.padToMinWidth);
          	
          	if (xSize / ySize > ratio) { // width greater
          		xSize = ySize * ratio;
          		if (xSize < x.minSize) { // below minWidth
          			xSize = x.minSize;
          			ySize = xSize / ratio;
          		}
          		changed = true;
          	
          	} else if (xSize / ySize < ratio) { // height greater
          		ySize = xSize / ratio;
          		changed = true;
          	}
          	
          	if (hs.padToMinWidth && x.full < x.minSize) {
          		x.imgSize = x.full;
          		y.size = y.imgSize = y.full;
          	} else if (this.useBox) {
          		x.imgSize = xSize;
          		y.imgSize = ySize;
          	} else {
          		x.size = xSize;
          		y.size = ySize;
          	}
          	changed = this.fitOverlayBox(useBox ? null : ratio, changed);
          	if (useBox && y.size < y.imgSize) {
          		y.imgSize = y.size;
          		x.imgSize = y.size * ratio;
          	}
          	if (changed || useBox) {
          		x.pos = x.tpos - x.cb + x.tb;
          		x.minSize = x.size;
          		this.justify(x, true);
          	
          		y.pos = y.tpos - y.cb + y.tb;
          		y.minSize = y.size;
          		this.justify(y, true);
          		if (this.overlayBox) this.sizeOverlayBox();
          	}
          },
          fitOverlayBox : function(ratio, changed) {
          	var x = this.x, y = this.y;
          	if (this.overlayBox) {
          		while (y.size > this.minHeight && x.size > this.minWidth 
          				&&  y.get('wsize') > y.get('fitsize')) {
          			y.size -= 10;
          			if (ratio) x.size = y.size * ratio;
          			this.sizeOverlayBox(0, 1);
          			changed = true;
          		}
          	}
          	return changed;
          },
          
          show : function () {
          	var x = this.x, y = this.y;
          	this.doShowHide('hidden');
          	
          	// Apply size change
          	this.changeSize(
          		1, {
          			wrapper: {
          				width : x.get('wsize'),
          				height : y.get('wsize'),
          				left: x.pos,
          				top: y.pos
          			},
          			content: {
          				left: x.p1 + x.get('imgPad'),
          				top: y.p1 + y.get('imgPad'),
          				width:x.imgSize ||x.size,
          				height:y.imgSize ||y.size
          			}
          		},
          		hs.expandDuration
          	);
          },
          
          changeSize : function(up, to, dur) {
          	
          	if (this.outline && !this.outlineWhileAnimating) {
          		if (up) this.outline.setPosition();
          		else this.outline.destroy();
          	}
          	
          	
          	if (!up) this.destroyOverlays();
          	
          	var exp = this,
          		x = exp.x,
          		y = exp.y,
          		easing = this.easing;
          	if (!up) easing = this.easingClose || easing;
          	var after = up ?
          		function() {
          				
          			if (exp.outline) exp.outline.table.style.visibility = "visible";
          			setTimeout(function() {
          				exp.afterExpand();
          			}, 50);
          		} :
          		function() {
          			exp.afterClose();
          		};
          	if (up) hs.setStyles( this.wrapper, {
          		width: x.t +'px',
          		height: y.t +'px'
          	});
          	if (this.fadeInOut) {
          		hs.setStyles(this.wrapper, { opacity: up ? 0 : 1 });
          		hs.extend(to.wrapper, { opacity: up });
          	}
          	hs.animate( this.wrapper, to.wrapper, {
          		duration: dur,
          		easing: easing,
          		step: function(val, args) {
          			if (exp.outline && exp.outlineWhileAnimating && args.prop == 'top') {
          				var fac = up ? args.pos : 1 - args.pos;
          				var pos = {
          					w: x.t + (x.get('wsize') - x.t) * fac,
          					h: y.t + (y.get('wsize') - y.t) * fac,
          					x: x.tpos + (x.pos - x.tpos) * fac,
          					y: y.tpos + (y.pos - y.tpos) * fac
          				};
          				exp.outline.setPosition(pos, 0, 1);				
          			}
          		}
          	});
          	hs.animate( this.content, to.content, dur, easing, after);
          	if (up) {
          		this.wrapper.style.visibility = 'visible';
          		this.content.style.visibility = 'visible';
          		this.a.className += ' highslide-active-anchor';
          	}
          },
          
          
          
          
          afterExpand : function() {
          	this.isExpanded = true;	
          	this.focus();
          	if (hs.upcoming && hs.upcoming == this.a) hs.upcoming = null;
          	this.prepareNextOutline();
          	var p = hs.page, mX = hs.mouse.x + p.scrollLeft, mY = hs.mouse.y + p.scrollTop;
          	this.mouseIsOver = this.x.pos < mX && mX < this.x.pos + this.x.get('wsize')
          		&& this.y.pos < mY && mY < this.y.pos + this.y.get('wsize');	
          	if (this.overlayBox) this.showOverlays();
          	
          },
          
          
          prepareNextOutline : function() {
          	var key = this.key;
          	var outlineType = this.outlineType;
          	new hs.Outline(outlineType, 
          		function () { try { hs.expanders[key].preloadNext(); } catch (e) {} });
          },
          
          
          preloadNext : function() {
          	var next = this.getAdjacentAnchor(1);
          	if (next && next.onclick.toString().match(/hs\.expand/)) 
          		var img = hs.createElement('img', { src: hs.getSrc(next) });
          },
          
          
          getAdjacentAnchor : function(op) {
          	var current = this.getAnchorIndex(), as = hs.anchors.groups[this.slideshowGroup || 'none'];
          	
          	/*< ? if ($cfg->slideshow) : ?>s*/
          	if (!as[current + op] && this.slideshow && this.slideshow.repeat) {
          		if (op == 1) return as[0];
          		else if (op == -1) return as[as.length-1];
          	}
          	/*< ? endif ?>s*/
          	return as[current + op] || null;
          },
          
          getAnchorIndex : function() {
          	var arr = hs.getAnchors().groups[this.slideshowGroup || 'none'];
          	if (arr) for (var i = 0; i < arr.length; i++) {
          		if (arr[i] == this.a) return i; 
          	}
          	return null;
          },
          
          
          cancelLoading : function() {
          	hs.discardElement (this.wrapper);
          	hs.expanders[this.key] = null;
          	if (this.loading) hs.loading.style.left = '-9999px';
          },
          
          writeCredits : function () {
          	this.credits = hs.createElement('a', {
          		href: hs.creditsHref,
          		target: hs.creditsTarget,
          		className: 'highslide-credits',
          		innerHTML: hs.lang.creditsText,
          		title: hs.lang.creditsTitle
          	});
          	this.createOverlay({ 
          		overlayId: this.credits, 
          		position: this.creditsPosition || 'top left' 
          	});
          },
          
          getInline : function(types, addOverlay) {
          	for (var i = 0; i < types.length; i++) {
          		var type = types[i], s = null;
          		if (!this[type +'Id'] && this.thumbsUserSetId)  
          			this[type +'Id'] = type +'-for-'+ this.thumbsUserSetId;
          		if (this[type +'Id']) this[type] = hs.getNode(this[type +'Id']);
          		if (!this[type] && !this[type +'Text'] && this[type +'Eval']) try {
          			s = eval(this[type +'Eval']);
          		} catch (e) {}
          		if (!this[type] && this[type +'Text']) {
          			s = this[type +'Text'];
          		}
          		if (!this[type] && !s) {
          			this[type] = hs.getNode(this.a['_'+ type + 'Id']);
          			if (!this[type]) {
          				var next = this.a.nextSibling;
          				while (next && !hs.isHsAnchor(next)) {
          					if ((new RegExp('highslide-'+ type)).test(next.className || null)) {
          						if (!next.id) this.a['_'+ type + 'Id'] = next.id = 'hsId'+ hs.idCounter++;
          						this[type] = hs.getNode(next.id);
          						break;
          					}
          					next = next.nextSibling;
          				}
          			}
          		}
          		
          		if (!this[type] && s) this[type] = hs.createElement('div', 
          				{ className: 'highslide-'+ type, innerHTML: s } );
          		
          		if (addOverlay && this[type]) {
          			var o = { position: (type == 'heading') ? 'above' : 'below' };
          			for (var x in this[type+'Overlay']) o[x] = this[type+'Overlay'][x];
          			o.overlayId = this[type];
          			this.createOverlay(o);
          		}
          	}
          },
          
          
          // on end move and resize
          doShowHide : function(visibility) {
          	if (hs.hideSelects) this.showHideElements('SELECT', visibility);
          	if (hs.hideIframes) this.showHideElements('IFRAME', visibility);
          	if (hs.geckoMac) this.showHideElements('*', visibility);
          },
          showHideElements : function (tagName, visibility) {
          	var els = document.getElementsByTagName(tagName);
          	var prop = tagName == '*' ? 'overflow' : 'visibility';
          	for (var i = 0; i < els.length; i++) {
          		if (prop == 'visibility' || (document.defaultView.getComputedStyle(
          				els[i], "").getPropertyValue('overflow') == 'auto'
          				|| els[i].getAttribute('hidden-by') != null)) {
          			var hiddenBy = els[i].getAttribute('hidden-by');
          			if (visibility == 'visible' && hiddenBy) {
          				hiddenBy = hiddenBy.replace('['+ this.key +']', '');
          				els[i].setAttribute('hidden-by', hiddenBy);
          				if (!hiddenBy) els[i].style[prop] = els[i].origProp;
          			} else if (visibility == 'hidden') { // hide if behind
          				var elPos = hs.getPosition(els[i]);
          				elPos.w = els[i].offsetWidth;
          				elPos.h = els[i].offsetHeight;
          			
          				
          					var clearsX = (elPos.x + elPos.w < this.x.get('opos') 
          						|| elPos.x > this.x.get('opos') + this.x.get('osize'));
          					var clearsY = (elPos.y + elPos.h < this.y.get('opos') 
          						|| elPos.y > this.y.get('opos') + this.y.get('osize'));
          				var wrapperKey = hs.getWrapperKey(els[i]);
          				if (!clearsX && !clearsY && wrapperKey != this.key) { // element falls behind image
          					if (!hiddenBy) {
          						els[i].setAttribute('hidden-by', '['+ this.key +']');
          						els[i].origProp = els[i].style[prop];
          						els[i].style[prop] = 'hidden';
          						
          					} else if (hiddenBy.indexOf('['+ this.key +']') == -1) {
          						els[i].setAttribute('hidden-by', hiddenBy + '['+ this.key +']');
          					}
          				} else if ((hiddenBy == '['+ this.key +']' || hs.focusKey == wrapperKey)
          						&& wrapperKey != this.key) { // on move
          					els[i].setAttribute('hidden-by', '');
          					els[i].style[prop] = els[i].origProp || '';
          				} else if (hiddenBy && hiddenBy.indexOf('['+ this.key +']') > -1) {
          					els[i].setAttribute('hidden-by', hiddenBy.replace('['+ this.key +']', ''));
          				}
          						
          			}
          		}
          	}
          },
          
          focus : function() {
          	this.wrapper.style.zIndex = hs.zIndexCounter += 2;
          	// blur others
          	for (var i = 0; i < hs.expanders.length; i++) {
          		if (hs.expanders[i] && i == hs.focusKey) {
          			var blurExp = hs.expanders[i];
          			blurExp.content.className += ' highslide-'+ blurExp.contentType +'-blur';
          				blurExp.content.style.cursor = hs.ie ? 'hand' : 'pointer';
          				blurExp.content.title = hs.lang.focusTitle;
          		}
          	}
          	
          	// focus this
          	if (this.outline) this.outline.table.style.zIndex 
          		= this.wrapper.style.zIndex - 1;
          	this.content.className = 'highslide-'+ this.contentType;
          		this.content.title = hs.lang.restoreTitle;
          		
          		if (hs.restoreCursor) {
          			hs.styleRestoreCursor = window.opera ? 'pointer' : 'url('+ hs.graphicsDir + hs.restoreCursor +'), pointer';
          			if (hs.ie && hs.uaVersion < 6) hs.styleRestoreCursor = 'hand';
          			this.content.style.cursor = hs.styleRestoreCursor;
          		}
          		
          	hs.focusKey = this.key;	
          	hs.addEventListener(document, window.opera ? 'keypress' : 'keydown', hs.keyHandler);	
          },
          moveTo: function(x, y) {
          	this.x.setPos(x);
          	this.y.setPos(y);
          },
          resize : function (e) {
          	var w, h, r = e.width / e.height;
          	w = Math.max(e.width + e.dX, Math.min(this.minWidth, this.x.full));
          	if (this.isImage && Math.abs(w - this.x.full) < 12) w = this.x.full;
          	h = w / r;
          	if (h < Math.min(this.minHeight, this.y.full)) {
          		h = Math.min(this.minHeight, this.y.full);
          		if (this.isImage) w = h * r;
          	}
          	this.resizeTo(w, h);
          },
          resizeTo: function(w, h) {
          	this.y.setSize(h);
          	this.x.setSize(w);
          	this.wrapper.style.height = this.y.get('wsize') +'px';
          },
          
          close : function() {
          	if (this.isClosing || !this.isExpanded) return;
          	this.isClosing = true;
          	
          	hs.removeEventListener(document, window.opera ? 'keypress' : 'keydown', hs.keyHandler);
          	
          	try {
          		this.content.style.cursor = 'default';
          		this.changeSize(
          			0, {
          				wrapper: {
          					width : this.x.t,
          					height : this.y.t,
          					left: this.x.tpos - this.x.cb + this.x.tb,
          					top: this.y.tpos - this.y.cb + this.y.tb
          				},
          				content: {
          					left: 0,
          					top: 0,
          					width: this.x.t,
          					height: this.y.t
          				}
          			}, hs.restoreDuration
          		);
          	} catch (e) { this.afterClose(); }
          },
          
          createOverlay : function (o) {
          	var el = o.overlayId;
          	if (typeof el == 'string') el = hs.getNode(el);
          	if (o.html) el = hs.createElement('div', { innerHTML: o.html });
          	if (!el || typeof el == 'string') return;
          	el.style.display = 'block';
          	this.genOverlayBox();
          	var width = o.width && /^[0-9]+(px|%)$/.test(o.width) ? o.width : 'auto';
          	if (/^(left|right)panel$/.test(o.position) && !/^[0-9]+px$/.test(o.width)) width = '200px';
          	var overlay = hs.createElement(
          		'div', {
          			id: 'hsId'+ hs.idCounter++,
          			hsId: o.hsId
          		}, {
          			position: 'absolute',
          			visibility: 'hidden',
          			width: width,
          			direction: hs.lang.cssDirection || '',
          			opacity: 0
          		},this.overlayBox,
          		true
          	);
          	
          	overlay.appendChild(el);
          	hs.extend(overlay, {
          		opacity: 1,
          		offsetX: 0,
          		offsetY: 0,
          		dur: (o.fade === 0 || o.fade === false || (o.fade == 2 && hs.ie)) ? 0 : 250
          	});
          	hs.extend(overlay, o);
          		
          	if (this.gotOverlays) {
          		this.positionOverlay(overlay);
          		if (!overlay.hideOnMouseOut || this.mouseIsOver) 
          			hs.animate(overlay, { opacity: overlay.opacity }, overlay.dur);
          	}
          	hs.push(this.overlays, hs.idCounter - 1);
          },
          positionOverlay : function(overlay) {
          	var p = overlay.position || 'middle center',
          		offX = overlay.offsetX,
          		offY = overlay.offsetY;
          	if (overlay.parentNode != this.overlayBox) this.overlayBox.appendChild(overlay);
          	if (/left$/.test(p)) overlay.style.left = offX +'px'; 
          	
          	if (/center$/.test(p))	hs.setStyles (overlay, { 
          		left: '50%',
          		marginLeft: (offX - Math.round(overlay.offsetWidth / 2)) +'px'
          	});	
          	
          	if (/right$/.test(p)) overlay.style.right = - offX +'px';
          		
          	if (/^leftpanel$/.test(p)) { 
          		hs.setStyles(overlay, {
          			right: '100%',
          			marginRight: this.x.cb +'px',
          			top: - this.y.cb +'px',
          			bottom: - this.y.cb +'px',
          			overflow: 'auto'
          		});		 
          		this.x.p1 = overlay.offsetWidth;
          	
          	} else if (/^rightpanel$/.test(p)) {
          		hs.setStyles(overlay, {
          			left: '100%',
          			marginLeft: this.x.cb +'px',
          			top: - this.y.cb +'px',
          			bottom: - this.y.cb +'px',
          			overflow: 'auto'
          		});
          		this.x.p2 = overlay.offsetWidth;
          	}
          
          	if (/^top/.test(p)) overlay.style.top = offY +'px'; 
          	if (/^middle/.test(p))	hs.setStyles (overlay, { 
          		top: '50%', 
          		marginTop: (offY - Math.round(overlay.offsetHeight / 2)) +'px'
          	});	
          	if (/^bottom/.test(p)) overlay.style.bottom = - offY +'px';
          	if (/^above$/.test(p)) {
          		hs.setStyles(overlay, {
          			left: (- this.x.p1 - this.x.cb) +'px',
          			right: (- this.x.p2 - this.x.cb) +'px',
          			bottom: '100%',
          			marginBottom: this.y.cb +'px',
          			width: 'auto'
          		});
          		this.y.p1 = overlay.offsetHeight;
          	
          	} else if (/^below$/.test(p)) {
          		hs.setStyles(overlay, {
          			position: 'relative',
          			left: (- this.x.p1 - this.x.cb) +'px',
          			right: (- this.x.p2 - this.x.cb) +'px',
          			top: '100%',
          			marginTop: this.y.cb +'px',
          			width: 'auto'
          		});
          		this.y.p2 = overlay.offsetHeight;
          		overlay.style.position = 'absolute';
          	}
          },
          
          getOverlays : function() {	
          	this.getInline(['heading', 'caption'], true);
          	if (this.heading && this.dragByHeading) this.heading.className += ' highslide-move';
          	if (hs.showCredits) this.writeCredits();
          	for (var i = 0; i < hs.overlays.length; i++) {
          		var o = hs.overlays[i], tId = o.thumbnailId, sg = o.slideshowGroup;
          		if ((!tId && !sg) || (tId && tId == this.thumbsUserSetId)
          				|| (sg && sg === this.slideshowGroup)) {
          			this.createOverlay(o);
          		}
          	}
          	var os = [];
          	for (var i = 0; i < this.overlays.length; i++) {
          		var o = hs.$('hsId'+ this.overlays[i]);
          		if (/panel$/.test(o.position)) this.positionOverlay(o);
          		else hs.push(os, o);
          	}
          	for (var i = 0; i < os.length; i++) this.positionOverlay(os[i]);
          	this.gotOverlays = true;
          },
          genOverlayBox : function() {
          	if (!this.overlayBox) this.overlayBox = hs.createElement (
          		'div', {
          			className: this.wrapperClassName
          		}, {
          			position : 'absolute',
          			width: (this.x.size || (this.useBox ? this.width : null) 
          				|| this.x.full) +'px',
          			height: (this.y.size || this.y.full) +'px',
          			visibility : 'hidden',
          			overflow : 'hidden',
          			zIndex : hs.ie ? 4 : 'auto'
          		},
          		hs.container,
          		true
          	);
          },
          sizeOverlayBox : function(doWrapper, doPanels) {
          	var overlayBox = this.overlayBox, 
          		x = this.x,
          		y = this.y;
          	hs.setStyles( overlayBox, {
          		width: x.size +'px', 
          		height: y.size +'px'
          	});
          	if (doWrapper || doPanels) {
          		for (var i = 0; i < this.overlays.length; i++) {
          			var o = hs.$('hsId'+ this.overlays[i]);
          			var ie6 = (hs.ieLt7 || document.compatMode == 'BackCompat');
          			if (o && /^(above|below)$/.test(o.position)) {
          				if (ie6) {
          					o.style.width = (overlayBox.offsetWidth + 2 * x.cb
          						+ x.p1 + x.p2) +'px';
          				}
          				y[o.position == 'above' ? 'p1' : 'p2'] = o.offsetHeight;
          			}
          			if (o && ie6 && /^(left|right)panel$/.test(o.position)) {
          				o.style.height = (overlayBox.offsetHeight + 2* y.cb) +'px';
          			}
          		}
          	}
          	if (doWrapper) {
          		hs.setStyles(this.content, {
          			top: y.p1 +'px'
          		});
          		hs.setStyles(overlayBox, {
          			top: (y.p1 + y.cb) +'px'
          		});
          	}
          },
          
          showOverlays : function() {
          	var b = this.overlayBox;
          	b.className = '';
          	hs.setStyles(b, {
          		top: (this.y.p1 + this.y.cb) +'px',
          		left: (this.x.p1 + this.x.cb) +'px',
          		overflow : 'visible'
          	});
          	if (hs.safari) b.style.visibility = 'visible';
          	this.wrapper.appendChild (b);
          	for (var i = 0; i < this.overlays.length; i++) {
          		var o = hs.$('hsId'+ this.overlays[i]);
          		o.style.zIndex = 4;
          		if (!o.hideOnMouseOut || this.mouseIsOver) {
          			o.style.visibility = 'visible';
          			hs.setStyles(o, { visibility: 'visible', display: '' });
          			hs.animate(o, { opacity: o.opacity }, o.dur);
          		}
          	}
          },
          
          destroyOverlays : function() {
          	if (!this.overlays.length) return;
          	hs.discardElement(this.overlayBox);
          },
          
          
          
          createFullExpand : function () {
          	this.fullExpandLabel = hs.createElement(
          		'a', {
          			href: 'javascript:hs.expanders['+ this.key +'].doFullExpand();',
          			title: hs.lang.fullExpandTitle,
          			className: 'highslide-full-expand'
          		}
          	);
          	
          	this.createOverlay({ 
          		overlayId: this.fullExpandLabel, 
          		position: hs.fullExpandPosition, 
          		hideOnMouseOut: true, 
          		opacity: hs.fullExpandOpacity
          	});
          },
          
          doFullExpand : function () {
          	try {
          		if (this.fullExpandLabel) hs.discardElement(this.fullExpandLabel);
          		
          		this.focus();
          		var xSize = this.x.size;
          		this.resizeTo(this.x.full, this.y.full);
          		
          		var xpos = this.x.pos - (this.x.size - xSize) / 2;
          		if (xpos < hs.marginLeft) xpos = hs.marginLeft;
          		
          		this.moveTo(xpos, this.y.pos);
          		this.doShowHide('hidden');
          	
          	} catch (e) {
          		this.error(e);
          	}
          },
          
          
          afterClose : function () {
          	this.a.className = this.a.className.replace('highslide-active-anchor', '');
          	
          	this.doShowHide('visible');
          		if (this.outline && this.outlineWhileAnimating) this.outline.destroy();
          	
          		hs.discardElement(this.wrapper);
          	
          	hs.expanders[this.key] = null;		
          	hs.reOrder();
          }
          
          };
          hs.langDefaults = hs.lang;
          // history
          var HsExpander = hs.Expander;
          if (hs.ie) {
          	(function () {
          		try {
          			document.documentElement.doScroll('left');
          		} catch (e) {
          			setTimeout(arguments.callee, 50);
          			return;
          		}
          		hs.ready();
          	})();
          }
          hs.addEventListener(document, 'DOMContentLoaded', hs.ready);
          hs.addEventListener(window, 'load', hs.ready);
          
          // set handlers
          hs.addEventListener(document, 'ready', function() {
          	if (hs.expandCursor) {
          		var style = hs.createElement('style', { type: 'text/css' }, null, 
          			document.getElementsByTagName('HEAD')[0]);
          			
          		function addRule(sel, dec) {		
          			if (!hs.ie) {
          				style.appendChild(document.createTextNode(sel + " {" + dec + "}"));
          			} else {
          				var last = document.styleSheets[document.styleSheets.length - 1];
          				if (typeof(last.addRule) == "object") last.addRule(sel, dec);
          			}
          		}
          		function fix(prop) {
          			return 'expression( ( ( ignoreMe = document.documentElement.'+ prop +
          				' ? document.documentElement.'+ prop +' : document.body.'+ prop +' ) ) + \'px\' );';
          		}
          		if (hs.expandCursor) addRule ('.highslide img', 
          			'cursor: url('+ hs.graphicsDir + hs.expandCursor +'), pointer !important;');
          	}
          });
          hs.addEventListener(window, 'resize', function() {
          	hs.getPageSize();
          });
          hs.addEventListener(document, 'mousemove', function(e) {
          	hs.mouse = { x: e.clientX, y: e.clientY	};
          });
          hs.addEventListener(document, 'mousedown', hs.mouseClickHandler);
          hs.addEventListener(document, 'mouseup', hs.mouseClickHandler);
          
          hs.addEventListener(document, 'ready', hs.getAnchors);
          hs.addEventListener(window, 'load', hs.preloadImages);
          }
          

          • Partager sur Facebook
          • Partager sur Twitter
            11 février 2010 à 12:24:55

            Ahhhhhh *-*
            Magnifique, mais pour moi sa reste assez incompréhensible, compréssé ou non xD.

            [edit] Fianelemnt pas si incompréhensible, déjà tu t'es trompé de JS xD Tu as décompréssé le simple et non celui avec galerie. Sinon pour avoir les miniatures sur la gauche et les boutons en bas c'est bon: j'ai simplement oublié de précisé le chemin du dossier graphics dans le JS.
            Si on pouvais juste éclairer ma lanterne sur les lignes que je doit modifier pour changer le style des boutons et du contour de la galerie sa serais merveilleux :D
            • Partager sur Facebook
            • Partager sur Twitter
              11 février 2010 à 12:28:57

              A la ligne 59 y'a showCredits.

              Pour le reste, moi non plus j'ai pas envie de me farcir autant de code pour ton bon plaisir :-°

              Apprendre le JS pourrait être bien...
              • Partager sur Facebook
              • Partager sur Twitter
                11 février 2010 à 12:46:10

                Bah j'essaye d'apprendre petit à patit mais mon site doit être opérationnel pour Mardi prochain (entretiens pour un job) donc je suis un peu contraint par le temps :/
                • Partager sur Facebook
                • Partager sur Twitter

                Configuration d'highslide

                × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
                × Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
                • Editeur
                • Markdown