It is currently Mon 26 Sep 2016 - 00:30 - créer un forum

Redimensionner automatiquement les images, version 2

Skip to content

Post new topic Reply to topic Goto page: <  1, 2, 312, 13, 14, 15, 16, 17  >

Redimensionner automatiquement les images, version 2
Author Message
djw139





PostPosted: Mon 3 Aug 2009 - 16:43    Post subject: Redimensionner automatiquement les images, version 2 Reply with quote

PublicitéSupprimer les publicités ?
Previous post review:

ok merci bcp je vais rtestez de suite
Author Message
Ada


Offline
Guest




PostPosted: Fri 14 Aug 2009 - 01:26    Post subject: Redimensionner automatiquement les images, version 2 Reply with quote

Bonjour, j'ai utilisé la 4ème méthode et je n'ai pas de problèmes mis à part que je voudrais enlever les pointillés autour des images réduites :



Author Message
lechti64
Membre


Offline
Membre

Joined: 13 Jun 2009
Posts: 10
Niveau:
Point(s): 10
Moyenne: 1.00
Windows Vista ou 7 Firefox (ou l'un de ses dérivés : Minefield/Pale Moon/...) Masculin Taureau (20avr-20mai) 牛 Buffle

PostPosted: Fri 14 Aug 2009 - 08:23    Post subject: Redimensionner automatiquement les images, version 2 Reply with quote

Voilà le script complet que j'utilise,pas de bordure en pointillé et quand on passe la souris sur l'image,celà marque " cliquez ici pour voir...."
100% fonctionnel chez moi
A copier dans :
overall_header.tpl


</script>
<!-- start mod : Resize Posted Images Based on Max Width -->
<script type="text/javascript">
//<![CDATA[
<!--

var rmw_max_width = 630; // you can change this number, this is the max width in pixels for posted images
var rmw_border_1 = '1px solid {T_BODY_LINK}';
var rmw_border_2 = '{T_BODY_LINK}';
var rmw_image_title = 'Cliquer pour agrandir cette image et profiter de celle ci en taille réelle {L_RMW_IMAGE_TITLE}';

//-->
//]]>
</script>

Si celà peux t'aider,penses juste à sauvegarder ton template avant,au cas ou...
lechti64
_______________________


Forum
Author Message
Ada


Offline
Guest




PostPosted: Fri 14 Aug 2009 - 11:37    Post subject: Redimensionner automatiquement les images, version 2 Reply with quote

Merci beaucoup c'est réglé mais j'ai un autre problème en fait : lorsque l'on clique sur l'image 2 pages s'ouvrent.
Exemple :
- http://i89.servimg.com/u/f89/13/69/70/08/guide_12.png
- http://www.servimg.com/image_preview.php?i=405&u=13697008

Comment faire en sorte que seule la 2ème s'ouvre?


Author Message
lechti64
Membre


Offline
Membre

Joined: 13 Jun 2009
Posts: 10
Niveau:
Point(s): 10
Moyenne: 1.00
Windows Vista ou 7 Firefox (ou l'un de ses dérivés : Minefield/Pale Moon/...) Masculin Taureau (20avr-20mai) 牛 Buffle

PostPosted: Fri 14 Aug 2009 - 12:13    Post subject: Redimensionner automatiquement les images, version 2 Reply with quote

Bien que tu ai réussi à régler ton problème.

pour ma part,j'ai moi aussi deux pages qui s'ouvre dans mon navigateur (Firefox3)
# La première ouvre une fenêtre indépendante de l'image en taille réelle,ce qui permet d'enregistrer l'image sur son disque dur
# la seconde page s'ouvre dans un nouvel onglet,avec en plus,un lien publicitaire vers un annonceur,là aussi tu peux enregistrer l'image sur ton disque dur,mais je ne me soucie pas de cette deuxième page,car j'utilise la première pour l'enregistrement et je ferme ensuite la page et l'onglet ouvert précédemment.
Je pense qu'il faut voir dans le code,là ou il faudrait supprimer le morceau de script qui ouvre l'onglet avec de la pub.

Si quelqu'un à une idée,nous sommes preneurs.
_______________________


Forum
Author Message
Ada


Offline
Guest




PostPosted: Sun 16 Aug 2009 - 12:18    Post subject: Redimensionner automatiquement les images, version 2 Reply with quote

up?

Author Message
Laeli


Offline
Guest




PostPosted: Sun 23 Aug 2009 - 17:05    Post subject: Redimensionner automatiquement les images, version 2 Reply with quote

Bonjour,

Voici la méthode que j'ai installée et qui fonctionne très bien.

altair wrote:
Bonsoir à tous


après avoir tester les deux premiers codes mais sans succès avec le thème ca_aphrodite (ça marche bien avec d'autre thèmes)
j'ai donc recherché un autre code alternatif que j'espère être compatible avec la plupart des thèmes

(le mieux serait de l'appliquer sur le thème de test tout d'abord)

{{{Troisième méthode}}}


Mais voilà, je ne voulais redimensionner que la largeur de l'image, j'ai sélectionné 650 pixels, et le problème est : cela redimensionne aussi la hauteur à 650 undecided
Moins bon là...
Y a t'il quelque chose à faire pour que ce ne soit que la largeur qui soit modifiée ?

Laeli


Author Message
themalin
Membre


Offline
Membre

Joined: 19 Apr 2006
Posts: 8,897
Point(s): 9,101
Moyenne: 1.02
Mac Firefox (ou l'un de ses dérivés : Minefield/Pale Moon/...)

PostPosted: Mon 24 Aug 2009 - 10:41    Post subject: Redimensionner automatiquement les images, version 2 Reply with quote

bonjour

mets le code comme ça
Code: Sélectionner - Agrandir

    <script type="text/javascript">

    SMR_confMaxDim = 600; // pixels

    function SMR_resize(obj) {

       thisWidth = obj.width;
       
       
       if(thisWidth > thisHeight) thisMaxDim = thisWidth;
       else thisMaxDim = thisHeight;
       
       if(thisMaxDim > SMR_confMaxDim) {
          thisMinDim = Math.round((((thisWidth > thisHeight)?thisHeight:thisWidth) * SMR_confMaxDim) / thisMaxDim);
         
          if(thisWidth > thisHeight) {
             thisWidth = SMR_confMaxDim;
             thisHeight = thisMinDim;
          } else {
             thisHeight = SMR_confMaxDim;
             thisWidth = thisMinDim;
          }
       } // if(thisMaxDim > SMR_confMaxDim)

       obj.height = thisHeight;
       obj.width = thisWidth;
    }
    function SMR_setLink(obj) {
       thisInnerHtml = obj.innerHTML;
       tmpArray = thisInnerHtml.split(' src=\"');
       tmpArray = tmpArray[1].split('"');
       obj.href = tmpArray[0];
    }

    </script>

_______________________


Forum
Author Message
Laeli


Offline
Guest




PostPosted: Mon 24 Aug 2009 - 11:11    Post subject: Redimensionner automatiquement les images, version 2 Reply with quote

Je remplace les données et mets celles-ci à la place ? (en changeant les pixels 600 par ceux que je veux).

Author Message
themalin
Membre


Offline
Membre

Joined: 19 Apr 2006
Posts: 8,897
Point(s): 9,101
Moyenne: 1.02
Mac Firefox (ou l'un de ses dérivés : Minefield/Pale Moon/...)

PostPosted: Mon 24 Aug 2009 - 11:17    Post subject: Redimensionner automatiquement les images, version 2 Reply with quote

tu remplaces le premier code donné dans la méthode 3 par celui ci et tu changes les 600 oui
_______________________


Forum
Author Message
Laeli


Offline
Guest




PostPosted: Mon 24 Aug 2009 - 11:52    Post subject: Redimensionner automatiquement les images, version 2 Reply with quote

J'ai remplacé la méthode 3 par les données que tu m'as édité plus haut. C'est retour à la case départ, les redimensions ne sont pas effectuées, alors j'ai remis les données M-3.

J'ai bien vérifié si je n'avais pas fait d'erreur, et tout semblait ok.

Donc, je suis toujours avec le problème de la redimension de la hauteur bloquée à 650 pixels.

Désolée Thémalin, mais ça ne colle pas. Peut être à cause du thème ? La base est Tolede.


Author Message
kristelnl


Offline
Guest




PostPosted: Sun 4 Oct 2009 - 09:51    Post subject: Redimensionner automatiquement les images, version 2 Reply with quote

OK, la méthode 3 est celle qui fonctionne le mieux chez moi (Theme Why). Merci !

Author Message
kristelnl


Offline
Guest




PostPosted: Sat 31 Oct 2009 - 18:10    Post subject: Redimensionner automatiquement les images, version 2 Reply with quote

Euhm, je reviens sur mon dernier message. Maintenant que j'ai passé le theme test en theme normal; quelques membres (utilisant internet explorer, je crois) ne voient plus du tout les photos. Le soucis, c'est que les autres méthodes ne fonctionnent pas correctement non plus avec mon theme.

Author Message
themalin
Membre


Offline
Membre

Joined: 19 Apr 2006
Posts: 8,897
Point(s): 9,101
Moyenne: 1.02
Mac Firefox (ou l'un de ses dérivés : Minefield/Pale Moon/...)

PostPosted: Sat 31 Oct 2009 - 19:12    Post subject: Redimensionner automatiquement les images, version 2 Reply with quote

bonjour

dis leur de faire ctrl +F5 pour voir
_______________________


Forum
Author Message
gp246
Membre


Offline
Membre

Joined: 18 Aug 2007
Posts: 46
Niveau:
Point(s): 47
Moyenne: 1.02
Windows XP (ou plus ancien) Internet Explorer

PostPosted: Thu 10 Dec 2009 - 02:25    Post subject: Redimensionner automatiquement les images, version 2 Reply with quote

Bonsoir a tous, petite question comme ca, dans le système de redimensionnement ont a dans la partie du Popbox vers la fin une variable que l'ont peut modifier pour la grandeur maximal de l'image mais est-ce possible de mettre quelques choses pour que la grandeur max soit celle de la résolution de l'utilisateur, nous n'avons pas tous la même résolution et si je fixe une variable je pénalise probablement beaucoup de monde si ma résolution est plus petite.

Moi j'ai inscrit maxwidth mais ont ^peut mettre 1280 ou 1024 c'est comme ont veut par contre si ont met 1024 c'est tout le monde qui aura du 1024 même si votre résolution est a 1280 et le problème peut être inverse aussi si vous y mettez 1440 par exemple, l.utilisateur qui est en 1024 devra faire aller son curseur pour regarder l'image au complet elle sera plus grande que ce que son écran lui permettra de voir.

J'aimerais avoir un one size fit all comme ont dit est-ce possible?

Code: Sélectionner - Agrandir
/********************************************************************************************************************
* PopBox.js, v2.5 released December 18, 2007. Copyright (c) 2007, C6 Software, Inc. (http://www.c6software.com/)
* PopBox is released under the Creative Commons Attribution 3.0 license (http://creativecommons.org/licenses/by/3.0/)
* and is free to use in both commercial and non-commercial work, provided this header remains at the top.
* The latest version and documentation can be found at http://www.c6software.com/products/popbox/default.aspx.
* Questions and suggestions can be sent to [url=mailto:john.reid@c6software.com]john.reid@c6software.com[/url]. Please put "PopBox" somewhere in the
* email subject so I can easily filter. Send me your URL and I may post it!
* PopBox relies on many methods from Danny Goodman's ([url=http://www.dannyg.com/]www.dannyg.com[/url]) javascript library DHTMLAPI.js
* and his books, without which scores of web developers would be totally lost. Thanks Danny.
********************************************************************************************************************/
// partie ajoutée afin de d'exclure les images de taille inférieure du redimensionnement
 
// Seek nested NN4 layer from string name
function SeekLayer(doc, name) {
    var theObj;
    for (var i = 0; i < doc.layers.length; i++) {
        if (doc.layers[i].name == name) {
            theObj = doc.layers[i];
            break;
        }
        // dive into nested layers if necessary
        if (doc.layers[i].document.layers.length > 0) {
            theObj = SeekLayer(document.layers[i].document, name);
        }
    }
    return theObj;
}
// Convert object name string or object reference into a valid element object reference
function GetRawObject(obj) {
    var theObj;
    if (typeof obj == "string") {
  var isCSS = (document.body && document.body.style) ? true : false;
        if (isCSS && document.getElementById) {
            theObj = document.getElementById(obj);
        } else if (isCSS && document.all) {
            theObj = document.all(obj);
        } else if (document.layers) {
            theObj = SeekLayer(document, obj);
        }
    } else {
        // pass through object reference
        theObj = obj;
    }
    return theObj;
}
// Return the available content width and height space in browser window
function GetInsideWindowSize() {
    if (window.innerWidth) {
        return {x:window.innerWidth, y:window.innerHeight};
    } else if (document.compatMode && document.compatMode.indexOf("CSS1") >= 0) {
        return {x:document.body.parentNode.clientWidth, y:document.body.parentNode.clientHeight};
    } else if (document.body && document.body.clientWidth) {
        return {x:document.body.clientWidth, y:document.body.clientHeight};
    }
    return {x:0, y:0};
}
// Retrieve the padding around an object
function GetObjectPadding(obj) {
 var elem = GetRawObject(obj);
 var l = 0;
 var r = 0;
 var t = 0;
 var b = 0;
 if (elem.currentStyle)
 {
  if (elem.currentStyle.paddingLeft)
   l = parseInt(elem.currentStyle.paddingLeft, 10);
  if (elem.currentStyle.paddingRight)
   r = parseInt(elem.currentStyle.paddingRight, 10);
  if (elem.currentStyle.paddingTop)
   t = parseInt(elem.currentStyle.paddingTop, 10);
  if (elem.currentStyle.paddingBottom)
   b = parseInt(elem.currentStyle.paddingBottom, 10);
 }
 else if (window.getComputedStyle)
 {
  l = parseInt(window.getComputedStyle(elem,null).paddingLeft, 10);
  r = parseInt(window.getComputedStyle(elem,null).paddingRight, 10);
  t = parseInt(window.getComputedStyle(elem,null).paddingTop, 10);
  b = parseInt(window.getComputedStyle(elem,null).paddingBottom, 10);
 }
 if (isNaN(l) == true) l = 0;
 if (isNaN(r) == true) r = 0;
 if (isNaN(t) == true) t = 0;
 if (isNaN(b) == true) b = 0;
 return {l:(l),r:(r),t:(t),b:(b)};
}
// Retrieve the rendered size of an element
function GetObjectSize(obj)  {
    var elem = GetRawObject(obj);
    var w = 0;
    var h = 0;
    if (elem.offsetWidth) {
   w = elem.offsetWidth; h = elem.offsetHeight;
    } else if (elem.clip && elem.clip.width) {
   w = elem.clip.width; h = elem.clip.height;
    } else if (elem.style && elem.style.pixelWidth) {
   w = elem.style.pixelWidth; h = elem.style.pixelHeight;
    }
   
    w = parseInt(w, 10);
    h = parseInt(h, 10);
   
   // remove any original element padding
   var padding = GetObjectPadding(elem);
   w -= (padding.l + padding.r);
   h -= (padding.t + padding.b);
   return {w:(w), h:(h)};
}
// Return the element position in the page, not it's parent container
function GetElementPosition(obj)
{
 var elem = GetRawObject(obj);
 var left = 0;
 var top = 0;
 // add any original element padding
 var elemPadding = GetObjectPadding(elem);
 left = elemPadding.l;
 top = elemPadding.t;
 if (elem.offsetParent)
 {
  left += elem.offsetLeft;
  top += elem.offsetTop;
  var parent = elem.offsetParent;
  while (parent)
  {
   left += parent.offsetLeft;
   top += parent.offsetTop;
   var parentTagName = parent.tagName.toLowerCase();
   if (parentTagName != "table" &&
    parentTagName != "body" &&
    parentTagName != "html" &&
    parentTagName != "div" &&
    parent.clientTop &&
    parent.clientLeft)
   {
    left += parent.clientLeft;
    top += parent.clientTop;
   }
   parent = parent.offsetParent;
  }
 }
 else if (elem.left && elem.top)
 {
  left = elem.left;
  top = elem.top;
 }
 else
 {
  if (elem.x)
   left = elem.x;
  if (elem.y)
   top = elem.y;
 }
 return {x:left, y:top};
}
// return the number of pixels the scrollbar has moved the visible window
function GetScrollOffset()
{
    if (window.pageYOffset) {
        return {x:window.pageXOffset, y:window.pageYOffset};
    } else if (document.compatMode && document.compatMode.indexOf("CSS1") >= 0) {
        return {x:document.documentElement.scrollLeft, y:document.documentElement.scrollTop};
    } else if (document.body && document.body.clientWidth) {
        return {x:document.body.scrollLeft, y:document.body.scrollTop};
    }
    return {x:0, y:0};
}
function CreateRandomId()
{
 var randomNum = 0.0;
 while (randomNum == 0.0)
  randomNum = Math.random();
 var random = randomNum + "";
 return "id" + random.substr(2);
}
function MouseMoveRevert(e)
{
 if (pbMouseMoveRevert != null && pbMouseMoveRevert.length != 0)
 {
  var evt = (e) ? e : window.event;
  var mouse = {x:0, y:0};
  if (evt.pageX || evt.pageY)
  {
   mouse.x = evt.pageX;
   mouse.y = evt.pageY;
  }
  else if (evt.clientX || evt.clientY)
  {
   var scroll = GetScrollOffset();
   mouse.x = evt.clientX + scroll.x;
   mouse.y = evt.clientY + scroll.y;
  }
  
  for (var x = 0; x < pbMouseMoveRevert.length;)
  {
   if (pbMouseMoveRevert[x] != null)
   {
    var id = pbMouseMoveRevert[x].id;
    if (typeof popBox[id] != "undefined" && popBox[id] != null && popBox[id].hTarg != 0)
    {
     // if the mouse is outside the box then call revert
     if (mouse.x < popBox[id].xTarg || mouse.x > (popBox[id].xTarg + popBox[id].wTarg) || mouse.y < popBox[id].yTarg || mouse.y > (popBox[id].yTarg + popBox[id].hTarg))
     {
      var className = pbMouseMoveRevert[x].className;
      pbMouseMoveRevert.splice(x, 1);
      Revert(id, null, className);
      continue;
     }
    }    
   }
   
   x++;
  }
 }
}
// holds numerous properties related to position, size and motion
var popBox = new Array();
// holds positioning value for the z axis
var popBoxZ = 100;
// holds the popped image for each <img> tag with a pbsrc attribute
var pbSrc = new Array();
// holds the popbar function for each <img> tag with a pbShowPopBar attribute
var pbPopBarFunc = new Array();
// holds the array of image ids for onmousemove Revert calls
var pbMouseMoveRevert = null;
// add initialization to window.onload
if (typeof window.onload == 'function')
{
 var func = window.onload;
 window.onload = function(){func();InitPbSrc();InitPbPopBar();};
}
else
{
 window.onload = function(){InitPbSrc();InitPbPopBar();};
}
// loads all the popped src images
function InitPbSrc()
{
 var images = null;
 if (document.body)
 {
  if (document.body.getElementsByTagName)
   images = document.body.getElementsByTagName("img");
  else if (document.body.all)
   images = document.body.all.tags("img");
 }
 if (images != null)
 {
  for (var x = 0; x < images.length; x++)
  {
   var poppedSrc = images[x].getAttribute('pbSrc');
   if (poppedSrc != null)
   {
    if (images[x].id == "")
     images[x].id = CreateRandomId();
     
    if (pbSrc[images[x].id] == null)
    {
     pbSrc[images[x].id] = new Image();
     pbSrc[images[x].id].src = poppedSrc;
    }
   }
  }
 }
}
// adds PopBar to images
function InitPbPopBar()
{
 var images = null;
 if (document.body)
 {
  if (document.body.getElementsByTagName)
   images = document.body.getElementsByTagName("img");
  else if (document.body.all)
   images = document.body.all.tags("img");
 }
 if (images != null)
 {
  var imgArray = new Array();
  for (var x = 0; x < images.length; x++)
  {
   if (images[x].id == "")
    images[x].id = CreateRandomId();
   
   imgArray[x] = images[x];
  }
  for (var x = 0; x < imgArray.length; x++)
   CreatePopBar(imgArray[x]);
 }
}
// initialize default popbox object
function InitPopBox(obj)
{
 obj = GetRawObject(obj);
 if (typeof popBox[obj.id] != "undefined" && popBox[obj.id] != null)
  return obj;
  
 var parent = document.body;
 if (obj.id == "")
  obj.id = CreateRandomId();
 var elem = obj;
 var startPos = GetElementPosition(elem);
 var initSize = GetObjectSize(elem);
 if (elem.style.position == "absolute" || elem.style.position == "relative")
 {
  parent = elem.parentNode;
  startPos.x = parseInt(elem.style.left, 10);
  startPos.y = parseInt(elem.style.top, 10);
 }
 
 // if there is a pbsrc then create that, else if it's not absolute or relative then create a copy
 if (pbSrc[elem.id] != null || (elem.style.position != "absolute" && elem.style.position != "relative"))
 {
  var img = document.createElement("img");
  // copy image properties
  img.border = elem.border;
  img.className = elem.className;
  img.height = elem.height;
  img.id = "popcopy" + elem.id;
  img.src = (pbSrc[elem.id] != null) ? pbSrc[elem.id].src : elem.src;
  img.alt = elem.alt;
  img.title = elem.title;
  img.width = elem.width;
  img.onclick = elem.onclick;
  img.ondblclick = elem.ondblclick;
  img.onmouseout = elem.onmouseout;
  // remove event so the object doesn't jump
  elem.onmouseout = null;
  img.style.width = initSize.w;
  img.style.height = initSize.h;
  img.style.position = "absolute";
  img.style.left = startPos.x + "px";
  img.style.top = startPos.y + "px";
  img.style.cursor = elem.style.cursor;
  
  parent.appendChild(img);
  elem.style.visibility = "hidden";
  elem = img;
 }
 
 popBox[elem.id] = { elemId:elem.id,
       xCurr:0.0,
       yCurr:0.0,
       xTarg:0.0,
       yTarg:0.0,
       wCurr:0.0,
       hCurr:0.0,
       wTarg:0.0,
       hTarg:0.0,
       xStep:0.0,
       yStep:0.0,
       wStep:0.0,
       hStep:0.0,
       xDelta:0.0,
       yDelta:0.0,
       wDelta:0.0,
       hDelta:0.0,
       xTravel:0.0,
       yTravel:0.0,
       wTravel:0.0,
       hTravel:0.0,
       velM:1.0,
       velS:1.0,
       interval:null,
       isAnimating:false,
       xOriginal:startPos.x,
       yOriginal:startPos.y,
       wOriginal:parseFloat(initSize.w),
       hOriginal:parseFloat(initSize.h),
       isPopped:false,
       fnClick:null,
       fnDone:null,
       fnPre:null,
       originalId:null,
       cursor:""
       };
       
 if (typeof obj.onclick == "function")
 {
  popBox[elem.id].fnClick = elem.onclick;
  
  if (popBoxAutoClose == true && (typeof obj.ondblclick != "function" || obj.ondblclick == null) && typeof obj.onmouseover != "function")
   elem.ondblclick = function(){Revert(elem.id, null, elem.className);};
 }
 if (popBoxAutoClose == true && typeof obj.onmouseover == "function" && (typeof obj.onmouseout != "function" || obj.onmouseout == null))
 {
  if (popBoxMouseMoveRevert == true)
  {
   if (pbMouseMoveRevert == null)
   {
    pbMouseMoveRevert = new Array();
    if (typeof document.onmousemove == 'function')
    {
     var func = document.onmousemove;
     document.onmousemove = function(e){func(e);MouseMoveRevert(e);};
    }
    else
    {
     document.onmousemove = MouseMoveRevert;
    }
   }
   
   pbMouseMoveRevert.push({id:elem.id, className:elem.className});
  }
  else
  {
   elem.onmouseout = function(){Revert(elem.id, null, elem.className);};
  }
 }
 if (obj.id != elem.id)
  popBox[elem.id].originalId = obj.id;
  
 return elem;
}
// calculate next steps and assign to style properties
function DoPopBox(elem)
{
 if (typeof elem == "string") elem = GetRawObject(elem);
 try
 {
  var bMDone = false;
  var bSDone = false;
  if ((popBox[elem.id].xTravel + Math.abs(popBox[elem.id].xStep)) < popBox[elem.id].xDelta)
  {
   var x = popBox[elem.id].xCurr + popBox[elem.id].xStep;
   elem.style.left = parseInt(x, 10) + "px";
   popBox[elem.id].xTravel += Math.abs(popBox[elem.id].xStep);
   popBox[elem.id].xCurr = x;
  } else {
   popBox[elem.id].xTravel += Math.abs(popBox[elem.id].xStep);
   elem.style.left = parseInt(popBox[elem.id].xTarg, 10) + "px";
   bMDone = true;
  }
  if ((popBox[elem.id].yTravel + Math.abs(popBox[elem.id].yStep)) < popBox[elem.id].yDelta)
  {
   var y = popBox[elem.id].yCurr + popBox[elem.id].yStep;
   elem.style.top = parseInt(y, 10) + "px";
   popBox[elem.id].yTravel += Math.abs(popBox[elem.id].yStep);
   popBox[elem.id].yCurr = y;
   bMDone = false;
  } else {
   popBox[elem.id].yTravel += Math.abs(popBox[elem.id].yStep);
   elem.style.top = parseInt(popBox[elem.id].yTarg, 10) + "px";
  }
  if ((popBox[elem.id].wTravel + Math.abs(popBox[elem.id].wStep)) < popBox[elem.id].wDelta)
  {
   var w = popBox[elem.id].wCurr + popBox[elem.id].wStep;
   elem.style.width = parseInt(w, 10) + "px";
   popBox[elem.id].wTravel += Math.abs(popBox[elem.id].wStep);
   popBox[elem.id].wCurr = w;
  } else {
   popBox[elem.id].wTravel += Math.abs(popBox[elem.id].wStep);
   elem.style.width = parseInt(popBox[elem.id].wTarg, 10) + "px";
   bSDone = true;
  }
  if ((popBox[elem.id].hTravel + Math.abs(popBox[elem.id].hStep)) < popBox[elem.id].hDelta)
  {
   var h = popBox[elem.id].hCurr + popBox[elem.id].hStep;
   elem.style.height = parseInt(h, 10) + "px";
   popBox[elem.id].hTravel += Math.abs(popBox[elem.id].hStep);
   popBox[elem.id].hCurr = h;
   bSDone = false;
  } else {
   popBox[elem.id].hTravel += Math.abs(popBox[elem.id].hStep);
   elem.style.height = parseInt(popBox[elem.id].hTarg, 10) + "px";
  }
  var obj = elem;
  
  if (bMDone == true && bSDone == true)
  {
   clearInterval(popBox[elem.id].interval);
   
   elem.style.cursor = popBox[elem.id].cursor;
   var func = null;
   if (popBox[elem.id].fnDone != null && typeof popBox[elem.id].fnDone == "function")
    func = popBox[elem.id].fnDone;
   
   if (popBox[elem.id].isPopped == true)
   {
    elem.style.zIndex = null;
 
    if (popBox[elem.id].originalId != null)
    {
     obj = GetRawObject(popBox[elem.id].originalId);
     obj.onmouseout = elem.onmouseout; // copy method back to original
     obj.style.visibility = "visible";
     
     // remove the copied object from the body and the array
     elem.parentNode.removeChild(elem);
    }
    else
    {
     elem.style.width = parseInt(popBox[elem.id].wOriginal, 10) + "px";
     elem.style.height = parseInt(popBox[elem.id].hOriginal, 10) + "px";
    
     if (typeof popBox[elem.id].fnClick == "function")
      elem.onclick = popBox[elem.id].fnClick;
    }
    delete popBox[elem.id];
    popBox[elem.id] = null;
    CreatePopBar(obj);
   }
   else
   {
    popBox[elem.id].isPopped = true;
    popBox[elem.id].isAnimating = false;
    CreateRevertBar(elem);
   }
    
   if (func != null && typeof func == "function")
    func(obj);
  }
 }
 catch(ex){}
}
function HasRevertBar(obj)
{
 if (typeof obj == "string") obj = GetRawObject(obj);
 
 var elem = obj;
 if (popBox[elem.id] != null && popBox[elem.id].originalId != null)
  elem = GetRawObject(popBox[elem.id].originalId);
 var pbShowBar = elem.getAttribute('pbShowRevertBar');
 var pbShowText = elem.getAttribute('pbShowRevertText');
 var pbShowImage = elem.getAttribute('pbShowRevertImage');
 pbShowBar = (pbShowBar != null) ? (pbShowBar == "true" || pbShowBar == true) : popBoxShowRevertBar;
 pbShowText = (pbShowText != null) ? (pbShowText == "true" || pbShowText == true) : popBoxShowRevertText;
 pbShowImage = (pbShowImage != null) ? (pbShowImage == "true" || pbShowImage == true) : popBoxShowRevertImage;
 
 return (pbShowBar || pbShowText || pbShowImage);
}
function HasCaption(obj)
{
 if (typeof obj == "string") obj = GetRawObject(obj);
 var elem = obj;
 if (popBox[elem.id] != null && popBox[elem.id].originalId != null)
  elem = GetRawObject(popBox[elem.id].originalId);
 var pbShowCaption = elem.getAttribute('pbShowCaption');
 pbShowCaption = (pbShowCaption != null) ? (pbShowCaption == "true" || pbShowCaption == true) : popBoxShowCaption;
 var pbCaption = null;
 if (pbShowCaption == true)
 {
  pbCaption = elem.getAttribute('pbCaption');
  if (pbCaption == null && elem.title != "") pbCaption = elem.title;
 }
 return (pbCaption != null && pbCaption != "");
}
function CreateRevertBar(obj)
{
 if (typeof obj == "string") obj = GetRawObject(obj);
 
 var elem = obj;
 if (popBox[elem.id] != null && popBox[elem.id].originalId != null)
  elem = GetRawObject(popBox[elem.id].originalId);
 var pbShowBar = elem.getAttribute('pbShowRevertBar');
 var pbShowText = elem.getAttribute('pbShowRevertText');
 var pbShowImage = elem.getAttribute('pbShowRevertImage');
 var pbText = elem.getAttribute('pbRevertText');
 var pbImage = elem.getAttribute('pbRevertImage');
 pbShowBar = (pbShowBar != null) ? (pbShowBar == "true" || pbShowBar == true) : popBoxShowRevertBar;
 pbShowText = (pbShowText != null) ? (pbShowText == "true" || pbShowText == true) : popBoxShowRevertText;
 pbShowImage = (pbShowImage != null) ? (pbShowImage == "true" || pbShowImage == true) : popBoxShowRevertImage;
 if (pbText == null) pbText = popBoxRevertText;
 if (pbImage == null) pbImage = popBoxRevertImage;
 var pbShowCaption = elem.getAttribute('pbShowCaption');
 pbShowCaption = (pbShowCaption != null) ? (pbShowCaption == "true" || pbShowCaption == true) : popBoxShowCaption;
 var pbCaption = null;
 if (pbShowCaption == true)
 {
  pbCaption = elem.getAttribute('pbCaption');
  if (pbCaption == null && elem.title != "") pbCaption = elem.title;
 }
 CreatePbBar(obj, pbShowBar, pbShowText, pbShowImage, pbText, pbImage, popBoxRevertBarAbove, true, pbCaption)
}
function CreatePopBar(obj)
{
 if (typeof obj == "string") obj = GetRawObject(obj);
 if (typeof pbPopBarFunc[obj.id] != 'undefined' && pbPopBarFunc[obj.id] != null) return;
 var pbShowBar = obj.getAttribute('pbShowPopBar');
 if (pbShowBar != null)
 {
  var pbShowText = obj.getAttribute('pbShowPopText');
  var pbShowImage = obj.getAttribute('pbShowPopImage');
  var pbText = obj.getAttribute('pbPopText');
  var pbImage = obj.getAttribute('pbPopImage');
  pbShowBar = (pbShowBar == "true" || pbShowBar == true);
  pbShowText = (pbShowText != null) ? (pbShowText == "true" || pbShowText == true) : popBoxShowPopText;
  pbShowImage = (pbShowImage != null) ? (pbShowImage == "true" || pbShowImage == true) : popBoxShowPopImage;
  if (pbText == null) pbText = popBoxPopText;
  if (pbImage == null) pbImage = popBoxPopImage;
  CreatePbBar(obj, pbShowBar, pbShowText, pbShowImage, pbText, pbImage, popBoxPopBarAbove, false, null)
 }
}
function CreatePbBar(obj, pbShowBar, pbShowText, pbShowImage, pbText, pbImage, pbBarAbove, isRevert, pbCaption)
{
 if (pbShowBar == false && pbShowText == false && pbShowImage == false && pbCaption == null) return;
 if (typeof obj == "string") obj = GetRawObject(obj);
 var objCursor = "hand";
 if (obj.currentStyle)
  objCursor = obj.currentStyle.cursor;
 else if (window.getComputedStyle)
  objCursor = window.getComputedStyle(obj,null).cursor;
 var fnClick = function(){if (typeof obj.onclick == 'function') obj.onclick();};
 var fnMouseOut = function(){if (typeof obj.onmouseout == 'function') obj.onmouseout();};
 var fnMouseOver = function(){if (typeof obj.onmouseover == 'function') obj.onmouseover();};
 var fnRemove = new Array();
 var isPositioned = (obj.style.position == "absolute" || obj.style.position == "relative");
 var left = 0;
 var top = 0;
 var parentNode = obj.parentNode;
 var objSpan = null;
 if (isPositioned == true)
 {
  left = parseInt(obj.style.left, 10);
  top = parseInt(obj.style.top, 10);
  var padding = GetObjectPadding(obj);
  left += padding.l;
  top += padding.t; 
 }
 else
 {
  objSpan = document.createElement("span");
  objSpan = (obj.nextSibling != null) ? parentNode.insertBefore(objSpan, obj.nextSibling) : parentNode.appendChild(objSpan);
  objSpan.style.position = "relative";
  objSpan.style.left = "0px";
  objSpan.style.top = "0px";
  var floatValue = "";
  if (obj.align == "left") floatValue = "left";
  else if (obj.align == "right") floatValue = "right";
  floatValue = (obj.style.styleFloat && obj.style.styleFloat != "") ? obj.style.styleFloat : (obj.style.cssFloat && obj.style.cssFloat != "") ? obj.style.cssFloat : floatValue;
  if (typeof obj.style.styleFloat != "undefined") objSpan.style.styleFloat = floatValue;
  else if (typeof obj.style.cssFloat != "undefined") objSpan.style.cssFloat = floatValue;
  
  var imgPos = GetElementPosition(obj);
  var spanPos = GetElementPosition(objSpan);
  objSpan.style.left = (spanPos.x > imgPos.x) ? (imgPos.x - spanPos.x) + "px" : imgPos.x - spanPos.x + "px";
  objSpan.style.top = (spanPos.y > imgPos.y) ? (imgPos.y - spanPos.y) + "px" : imgPos.y - spanPos.y + "px";
  
  
  if (isRevert == true)
   objSpan.onmouseout = fnMouseOut;
  else
   objSpan.onmouseover = fnMouseOver;
  parentNode = objSpan;
 }
 var width = parseInt(obj.style.width, 10);
 var height = parseInt(obj.style.height, 10);
 var size = GetObjectSize(obj);
 if (isNaN(width) == true)
  width = size.w;
 else if (size.w > width)
  left += ((size.w - width) / 2);
 if (isNaN(height) == true)
  height = size.h;
 else if (size.h > height)
  top += ((size.h - height) / 2);
 if (pbBarAbove == true) top -= 20;
 var z = obj.style.zIndex + 1;
 if (pbShowBar == true)
 {
  var divTrans = document.createElement("div");
  divTrans.id = "popBoxDivTrans" + z;
  divTrans.style.width = width + "px";
  divTrans.style.height = "20px";
  divTrans.style.borderStyle = "none";
  divTrans.style.padding = "0px";
  divTrans.style.margin = "0px";
  divTrans.style.position = "absolute";
  divTrans.style.left = left + "px";
  divTrans.style.top = top + "px";
  divTrans.style.backgroundColor = "#000000";
  divTrans.style.cursor = objCursor;
  divTrans.style.zIndex = z;
  if (pbBarAbove == false)
  {
   if (typeof divTrans.style.filter != 'undefined')
    divTrans.style.filter = "progid:DXImageTransform.Microsoft.Alpha(opacity=20)";
   if (typeof divTrans.style.opacity != 'undefined')
    divTrans.style.opacity = "0.2";
  }
  divTrans.onclick = fnClick;
  if (isRevert == true)
   divTrans.onmouseout = fnMouseOut;
  else
   divTrans.onmouseover = fnMouseOver;
  parentNode.appendChild(divTrans);
  
  fnRemove.push(function(){divTrans.parentNode.removeChild(divTrans);});
 }
 if (pbShowText == true)
 {
  var divText = document.createElement("div");
  divText.id = "popBoxDivText" + z;
  divText.style.width = width + "px";
  divText.style.height = "20px";
  divText.style.borderStyle = "none";
  divText.style.padding = "0px";
  divText.style.margin = "0px";
  divText.style.position = "absolute";
  divText.style.left = left + "px";
  divText.style.top = top + "px";
  divText.style.cursor = objCursor;
  divText.style.textAlign = "center";
  divText.style.fontFamily = "Arial, Verdana, Sans-Serif";
  divText.style.fontSize = "10pt";
  divText.style.backgroundColor = "Transparent";
  divText.style.color = "#ffffff";
  divText.style.zIndex = z;
  divText.innerHTML = pbText;
  divText.onclick = fnClick;
  if (isRevert == true)
   divText.onmouseout = fnMouseOut;
  else
   divText.onmouseover = fnMouseOver;
  parentNode.appendChild(divText);
  fnRemove.push(function(){divText.parentNode.removeChild(divText);});
 }
 
 if (pbShowImage == true)
 {
  var imgPopped = document.createElement("img");
  imgPopped.id = "popBoxImgPopped" + z;
  imgPopped.src = pbImage;
  imgPopped.style.width = "20px";
  imgPopped.style.height = "20px";
  imgPopped.style.borderStyle = "none";
  imgPopped.style.padding = "0px";
  imgPopped.style.margin = "0px";
  imgPopped.style.position = "absolute";
  imgPopped.style.left = (left + width - 20) + "px";
  imgPopped.style.top = top + "px";
  imgPopped.style.cursor = objCursor;
  imgPopped.style.zIndex = z;
  imgPopped.onclick = fnClick;
  if (isRevert == true)
   imgPopped.onmouseout = fnMouseOut;
  else
   imgPopped.onmouseover = fnMouseOver;
  parentNode.appendChild(imgPopped);
  fnRemove.push(function(){imgPopped.parentNode.removeChild(imgPopped);});
 }
 
 if (pbCaption != null && pbCaption != "")
 {
  top += (height - 20);
  if (pbBarAbove == true) top += 20;
  if (popBoxCaptionBelow == true)  top += 20;
  var divCapTrans = document.createElement("div");
  divCapTrans.id = "popBoxDivCapTrans" + z;
  divCapTrans.style.width = width - 2 + "px";
  divCapTrans.style.height = "20px";
  divCapTrans.style.borderStyle = "solid";
  divCapTrans.style.borderWidth = "1px";
  divCapTrans.style.borderColor = "#999999";
  divCapTrans.style.padding = "0px";
  divCapTrans.style.margin = "0px";
  divCapTrans.style.position = "absolute";
  divCapTrans.style.left = left + "px";
  divCapTrans.style.top = top - 1 + "px";
  divCapTrans.style.backgroundColor = "#ffffdd";
  divCapTrans.style.zIndex = z;
  if (popBoxCaptionBelow == false)
  {
   if (typeof divCapTrans.style.filter != 'undefined')
    divCapTrans.style.filter = "progid:DXImageTransform.Microsoft.Alpha(opacity=70)";
   if (typeof divCapTrans.style.opacity != 'undefined')
    divCapTrans.style.opacity = "0.7";
  }
  parentNode.appendChild(divCapTrans);
  fnRemove.push(function(){divCapTrans.parentNode.removeChild(divCapTrans);});
  var divCapText = document.createElement("div");
  divCapText.id = "popBoxDivCapText" + z;
  divCapText.style.width = width - 20 + "px";
  divCapText.style.height = "20px";
  divCapText.style.borderStyle = "none";
  divCapText.style.padding = "0px";
  divCapText.style.margin = "0px";
  divCapText.style.position = "absolute";
  divCapText.style.left = left + 10 + "px";
  divCapText.style.top = top + "px";
  divCapText.style.textAlign = "center";
  divCapText.style.fontFamily = "Arial, Verdana, Sans-Serif";
  divCapText.style.fontSize = "10pt";
  divCapText.style.overflowY = "hidden";
  divCapText.style.backgroundColor = "Transparent";
  divCapText.style.color = "#000000";
  divCapText.style.zIndex = z;
  parentNode.appendChild(divCapText);
  fnRemove.push(function(){divCapText.parentNode.removeChild(divCapText);});
  AddCaptionText(divCapTrans, divCapText, pbCaption);
 }
 if (fnRemove.length != 0)
 {
  if (objSpan != null)
   fnRemove.push(function(){objSpan.parentNode.removeChild(objSpan);});
  
  if (isRevert == true)
  {
   if(popBox[obj.id].fnPre != null && typeof(popBox[obj.id].fnPre) == 'function')
    fnRemove.push(popBox[obj.id].fnPre);
  
   popBox[obj.id].fnPre = function(){for(var x = 0; x < fnRemove.length; x++){fnRemove[x]();}};
  }
  else
  {
   pbPopBarFunc[obj.id] = function(){for(var x = 0; x < fnRemove.length; x++){fnRemove[x]();}};
  }
 }
}
function AddCaptionText(divCapTrans, divCapText, caption)
{
 var width = parseInt(divCapText.style.width, 10);
 var divSizer = document.createElement("div");
 divSizer.style.position = "absolute";
 divSizer.style.width = width + "px";
 divSizer.style.margin = "0px";
 divSizer.style.fontFamily = divCapText.style.fontFamily;
 divSizer.style.fontSize = divCapText.style.fontSize;
 divSizer.style.visibility = "hidden";
 divSizer.innerHTML = caption;
 document.body.appendChild(divSizer);
 var newSize = GetObjectSize(divSizer);
 if (newSize.h > 20)
 {
  divSizer.innerHTML = caption + "..." + popBoxCaptionLessText;
  newSize = GetObjectSize(divSizer);
  var fullCaption = caption;
  var charCount = parseInt(width * 0.14, 10) - 5; // safe estimate
  divCapText.innerHTML = caption.substr(0, charCount) + "...";
  
  var spanMore = document.createElement("span");
  spanMore.style.color = "#0000ff";
  spanMore.style.textDecoration = "underline";
  spanMore.style.cursor = "pointer";
  spanMore.onclick = function(){spanMore.parentNode.removeChild(spanMore);ResizeCaption(divCapTrans.id,divCapText.id,newSize.h,fullCaption);};
  spanMore.innerHTML = popBoxCaptionMoreText;
  divCapText.appendChild(spanMore);
 }
 else
  divCapText.innerHTML = caption;
 document.body.removeChild(divSizer);
}
function ResizeCaption(divCapTrans, divCapText, height, caption)
{
 if (typeof divCapTrans == "string") divCapTrans = GetRawObject(divCapTrans);
 if (typeof divCapText == "string") divCapText = GetRawObject(divCapText);
 var h = parseInt(divCapText.style.height, 10);
 var top = parseInt(divCapText.style.top, 10);
 
 if (h < height)
 {
  if (h == 20)
  {
   height += 10;
   divCapText.style.paddingTop = "5px";
   divCapText.innerHTML = caption + "...";
   
   var spanLess = document.createElement("span");
   spanLess.style.color = "#0000ff";
   spanLess.style.textDecoration = "underline";
   spanLess.style.cursor = "pointer";
   spanLess.onclick = function(){spanLess.parentNode.removeChild(spanLess);divCapText.innerHTML = caption;ResizeCaption(divCapTrans.id,divCapText.id,20,caption);};
   spanLess.innerHTML = popBoxCaptionLessText;
   divCapText.appendChild(spanLess);
   
   if (popBoxCaptionBelow == false)
   {
    if (typeof divCapTrans.style.filter != 'undefined')
     divCapTrans.style.filter = "";
    if (typeof divCapTrans.style.opacity != 'undefined')
     divCapTrans.style.opacity = "1.0";
   }
  }
  
  if ((h + 10) >= height)
  {
   top -= (height - h);
   h = height;
  }
  else
  {
   top -= 10;
   h += 10;
  }
  
  divCapTrans.style.height = h + "px";
  divCapText.style.height = h + "px";
  divCapTrans.style.top = (top - 1) + "px";
  divCapText.style.top = top + "px";
  if (h != height)
   setTimeout("ResizeCaption(\"" + divCapTrans.id + "\",\"" + divCapText.id + "\"," + height + ",\"" + caption + "\")", 10);
 }
 else
 {
  if ((h - 10) <= height)
  {
   top += (h - height);
   h = height;
  }
  else
  {
   top += 10;
   h -= 10;
  }
  
  divCapTrans.style.height = h + "px";
  divCapText.style.height = h + "px";
  divCapTrans.style.top = (top - 1) + "px";
  divCapText.style.top = top + "px";
  divCapText.style.paddingTop = "0px";
  if (h == height)
  {
   if (popBoxCaptionBelow == false)
   {
    if (typeof divCapTrans.style.filter != 'undefined')
     divCapTrans.style.filter = "progid:DXImageTransform.Microsoft.Alpha(opacity=70)";
    if (typeof divCapTrans.style.opacity != 'undefined')
     divCapTrans.style.opacity = "0.7";
   }
   AddCaptionText(divCapTrans, divCapText, caption);
  }
  else
  {
   setTimeout("ResizeCaption(\"" + divCapTrans.id + "\",\"" + divCapText.id + "\"," + height + ",\"" + caption + "\")", 10);
  }
 }
}
function CreateWaitImage(obj)
{
 if (typeof obj == "string") obj = GetRawObject(obj);
 var newId = "popBoxImgWait" + obj.id;
 var imgWait = GetRawObject(newId);
 if (imgWait != null)
  return imgWait;
 var left = 0;
 var top = 0;
 if (obj.style.position == "absolute" || obj.style.position == "relative")
 {
  left = parseInt(obj.style.left, 10);
  top = parseInt(obj.style.top, 10);
 }
 else
 {
  var xy = GetElementPosition(obj);
  left = xy.x;
  top = xy.y;
  var padding = GetObjectPadding(obj);
  left -= padding.l;
  top -= padding.t;
 }
 var width = parseInt(obj.style.width, 10);
 var height = parseInt(obj.style.height, 10);
 var size = GetObjectSize(obj);
 if (isNaN(width) == true)
  width = size.w;
 else if (size.w > width)
  left += ((size.w - width) / 2);
 if (isNaN(height) == true)
  height = size.h;
 else if (size.h > height)
  top += ((size.h - height) / 2);
 var parentNode = obj.parentNode;
 imgWait = document.createElement("img");
 imgWait.id = newId;
 imgWait.src = popBoxWaitImage.src;
 imgWait.style.position = "absolute";
 imgWait.style.left = (left + (width / 2) - (popBoxWaitImage.width / 2)) + "px";
 imgWait.style.top = (top + (height / 2) - (popBoxWaitImage.height / 2)) + "px";
 imgWait.style.cursor = obj.style.cursor;
 imgWait.style.zIndex = obj.style.zIndex + 1;
 parentNode.appendChild(imgWait);
 return imgWait;
}
// encapsulates the Popped image sizing logic
function CalculateImageDimensions(newWidth, newHeight, fullWidth, fullHeight, windowSize)
{
 if (newWidth == null)
 {
  if (newHeight == null)
  {
   newWidth = fullWidth;
   newHeight = fullHeight;
  }
  else if (newHeight == 0)
  {
   newHeight = Math.min(windowSize.y, fullHeight);
   var scale = parseFloat(newHeight) / parseFloat(fullHeight);
   newWidth = parseInt(fullWidth * scale);
  }
  else
  {
   var scale = parseFloat(newHeight) / parseFloat(fullHeight);
   newWidth = parseInt(fullWidth * scale);
  }
 }
 else if (newWidth == 0)
 {
  if (newHeight == null)
  {
   newWidth = Math.min(windowSize.x, fullWidth);
   var scale = parseFloat(newWidth) / parseFloat(fullWidth);
   newHeight = parseInt(fullHeight * scale);
  }
  else if (newHeight == 0)
  {
   if (windowSize.x < fullWidth || windowSize.y < fullHeight)
   {
    var scale = Math.min(parseFloat(windowSize.x) / parseFloat(fullWidth), parseFloat(windowSize.y) / parseFloat(fullHeight));
    newWidth = parseInt(fullWidth * scale);
    newHeight = parseInt(fullHeight * scale);
   }
   else
   {
    newWidth = fullWidth;
    newHeight = fullHeight;
   }
  }
  else
  {
   var scale = parseFloat(newHeight) / parseFloat(fullHeight);
   newWidth = Math.min(windowSize.x, parseInt(fullWidth * scale));
  }
 }
 else
 {
  if (newHeight == null)
  {
   var scale = parseFloat(newWidth) / parseFloat(fullWidth);
   newHeight = parseInt(fullHeight * scale);
  }
  else if (newHeight == 0)
  {
   var scale = parseFloat(newWidth) / parseFloat(fullWidth);
   newHeight = Math.min(windowSize.y, parseInt(fullHeight * scale));
  }
 }
 
 return {x:newWidth, y:newHeight};
}
/***************************************************************************************************
* This is where the user-callable section starts.
* Function signatures above this line are subject to change.
***************************************************************************************************/
// Globals you can assign
var popBoxAutoClose = true;
var popBoxMouseMoveRevert = true;
var popBoxWaitImage = new Image();
popBoxWaitImage.src = "/images/spinner40.gif";
var popBoxShowRevertBar = false;
var popBoxShowRevertText = false;
var popBoxShowRevertImage = true;
var popBoxRevertText = "Cliquez pour R&eacute;duire.";
var popBoxRevertImage = "/images/magminus.gif";
var popBoxRevertBarAbove = false;
// there is no popBoxShowPopBar global, but instead the pbShowPopBar attribute must be
// set on the img for the PopBar funtionality to work (can be true or false)
var popBoxShowPopText = false;
var popBoxShowPopImage = true;
var popBoxPopText = "Cliquez pour Agrandir.";
var popBoxPopImage = "/images/magplus.gif";
var popBoxPopBarAbove = false;
var popBoxShowCaption = false;
var popBoxCaptionBelow = false;
var popBoxCaptionMoreText = "more";
var popBoxCaptionLessText = "less";
// these custom attributes on the <img> element will override the globals above
// pbShowRevertBar, pbShowRevertText, pbShowRevertImage, pbRevertText, pbRevertImage
// pbShowPopBar, pbShowPopText, pbShowPopImage, pbPopText, pbPopImage, pbShowCaption
// Advanced method to begin moves and resizes. (Use Pop/PopEx and Revert where possible instead.)
// X and Y postfixes refer to the top left pixel. W and H postfixes refer to the width and height
// speedM and speedS are the speeds of the move and size respectively
// className denotes the CSS class to apply to the object that is being moved and/or sized
// fnDone denotes the script method to run when the move/resize is complete. It must have a single
// parameter that holds the object itself.
function PopBox(obj, startX, startY, endX, endY, startW, startH, endW, endH, speedM, speedS, className, fnDone)
{
 if (typeof obj == "string") obj = GetRawObject(obj);
 if (obj == null || typeof obj != "object" || isNaN(startX) || isNaN(startY) || isNaN(endX) || isNaN(endY) || isNaN(startW) || isNaN(startH) || isNaN(endW) || isNaN(endH) || isNaN(speedM) || isNaN(speedS))
  return;
 var elem = InitPopBox(obj);
 if (popBox[elem.id].isAnimating == true)
 {
  var str = "PopBox('" + elem.id + "'," + startX + "," + startY + "," + endX + "," + endY + "," + startW + "," + startH + "," + endW + "," + endH + "," + speedM + "," + speedS + ",'" + className + "');";
  setTimeout(str, 10);
 }
 else
 {
  popBox[elem.id].isAnimating = true;
  popBox[elem.id].xCurr = parseFloat(startX);
  popBox[elem.id].yCurr = parseFloat(startY);
  popBox[elem.id].wCurr = parseFloat(startW);
  popBox[elem.id].hCurr = parseFloat(startH);
  popBox[elem.id].xTarg = parseFloat(endX);
  popBox[elem.id].yTarg = parseFloat(endY);
  popBox[elem.id].wTarg = parseFloat(endW);
  popBox[elem.id].hTarg = parseFloat(endH);
  popBox[elem.id].xDelta = Math.abs(parseFloat(endX) - parseFloat(startX));
  popBox[elem.id].yDelta = Math.abs(parseFloat(endY) - parseFloat(startY));
  popBox[elem.id].wDelta = Math.abs(parseFloat(endW) - parseFloat(startW));
  popBox[elem.id].hDelta = Math.abs(parseFloat(endH) - parseFloat(startH));
  popBox[elem.id].velM = (speedM) ? Math.abs(parseFloat(speedM)) : 1.0;
  popBox[elem.id].velS = (speedS) ? Math.abs(parseFloat(speedS)) : 1.0;
  popBox[elem.id].xTravel = 0.0;
  popBox[elem.id].yTravel = 0.0;
  popBox[elem.id].wTravel = 0.0;
  popBox[elem.id].hTravel = 0.0;
  // set element's start position
  elem.style.position = "absolute";
  elem.style.left = startX + "px";
  elem.style.top = startY + "px";
  // set element's start size
  elem.style.width = startW + "px";
  elem.style.height = startH + "px";
  elem.style.display = "inline";
  // the length of the line between start and end points
  var lenMove = Math.sqrt((Math.pow((startX - endX), 2)) + (Math.pow((startY - endY), 2)));
  var lenSize = Math.sqrt((Math.pow((startW - endW), 2)) + (Math.pow((startH - endH), 2)));
  // if the speeds are the same then they should be in sync
  if (popBox[elem.id].velM == popBox[elem.id].velS)
   lenMove = lenSize = Math.sqrt(Math.pow(lenMove, 2) + Math.pow(lenSize, 2));
  // how big the pixel steps are along each axis
  popBox[elem.id].xStep = ((popBox[elem.id].xTarg - popBox[elem.id].xCurr) / lenMove) * popBox[elem.id].velM;
  popBox[elem.id].yStep = ((popBox[elem.id].yTarg - popBox[elem.id].yCurr) / lenMove) * popBox[elem.id].velM;
  // how big the pixel steps are for each resize
  popBox[elem.id].wStep = ((popBox[elem.id].wTarg - popBox[elem.id].wCurr) / lenSize) * popBox[elem.id].velS;
  popBox[elem.id].hStep = ((popBox[elem.id].hTarg - popBox[elem.id].hCurr) / lenSize) * popBox[elem.id].velS;
  
  popBox[elem.id].fnDone = fnDone;
  if (className != null)
   elem.className = className;
  popBox[elem.id].cursor = elem.style.cursor;
  elem.style.cursor = "default";
  if (popBox[elem.id].isPopped == false)
   elem.style.zIndex = ++popBoxZ;
  var id = elem.id;
  if (popBox[elem.id].originalId != null) id = popBox[elem.id].originalId;
  if (pbPopBarFunc[id] != null)
  {
   pbPopBarFunc[id]();
   pbPopBarFunc[id] = null;
  }
   
  if (popBox[elem.id].fnPre != null && typeof popBox[elem.id].fnPre == 'function')
   popBox[elem.id].fnPre();
  // start the repeated invocation of the animation
  popBox[elem.id].interval = setInterval("DoPopBox('" + elem.id + "')", 10);
 }
}
/***************************************************************************************************
* Helper functions. Use these! They are much easier. Call Pop/PopEx and then Revert, or set the
* popBoxAutoClose global to true and Revert will be called for you.
***************************************************************************************************/
// this basic method centers the image in the browser and displays it at its full resolution, subject to window size.
function Pop(obj, speed, className)
{
 PopEx(obj, null, null, 0, 0, speed, className);
}
// If newLeft is null then the image is centered horizontally in the browser. Ditto for newTop (vertically).
// End newLeft and/or newTop with "A" for an absolute position, otherwise it is treated as a relative position.
// Ex: a newLeft of 20 would move right 20 pixels, "20A" would position 20 pixels from the left of it's containing element.
// If newWidth is 0 then the full image width is used, subject to scaling and window size. Ditto for newHeight.
// If newWidth is null the full width is used, regardless of window size, but still subject to scaling. Ditto for newHeight.
function PopEx(obj, newLeft, newTop, newWidth, newHeight, speed, className)
{
 if (typeof obj == "string") obj = GetRawObject(obj);
 if (obj.id == "")
  obj.id = CreateRandomId();
 var poppedSrc = obj.getAttribute('pbSrcNL');
 if (poppedSrc == null && pbSrc[obj.id] == null)
  poppedSrc = obj.getAttribute('pbSrc');
 if (poppedSrc != null)
 {
  var poppedImg = new Image();
  poppedImg.src = poppedSrc;
  
  if (pbSrc[obj.id] != null)
   delete pbSrc[obj.id];
   
  pbSrc[obj.id] = poppedImg;
 }
 
 var objToPop = (pbSrc[obj.id] != null) ? pbSrc[obj.id] : obj;
 var isReady = (typeof objToPop.readyState != 'undefined') ? (objToPop.readyState == "complete") : ((typeof objToPop.complete != 'undefined') ? (objToPop.complete == true) : true);
 if (isReady == false)
 {
  var imgWait = CreateWaitImage(obj);
  var str = "var imgWait = GetRawObject('" + imgWait.id + "'); if (imgWait != null) { imgWait.parentNode.removeChild(imgWait); PopEx('" + obj.id + "'," + newLeft + "," + newTop + "," + newWidth + "," + newHeight + "," + speed + ",'" + className + "'); }";
  objToPop.onload = new Function("", str);
  return;
 }
 var elem = InitPopBox(obj);
 if (popBox[elem.id].isPopped == true) return;
 if (typeof elem.ondblclick == "function")
  elem.onclick = elem.ondblclick;
 var startX = parseInt(elem.style.left);
 var startY = parseInt(elem.style.top);
 // figure out the popped image size and position
 var windowSize = GetInsideWindowSize();
 var hasRevertBar = HasRevertBar(obj);
 var hasCaption = HasCaption(obj);
 if (hasRevertBar == true && popBoxRevertBarAbove == true) windowSize.y -= 20;
 if (hasCaption == true && popBoxCaptionBelow == true) windowSize.y -= 20;
 var fullWidth = newWidth;
 var fullHeight = newHeight;
 if (newWidth == 0 || newHeight == 0 || newWidth == null || newHeight == null)
 {
  // get size from original object
  if (pbSrc[obj.id] != null)
  {
   fullWidth = pbSrc[obj.id].width;
   fullHeight = pbSrc[obj.id].height;
  }
  else if (obj.naturalWidth && obj.naturalHeight)
  {
   fullWidth = obj.naturalWidth;
   fullHeight = obj.naturalHeight;
  }
  else
  {
   var img = new Image();
   img.src = elem.src;
   fullWidth = img.width;
   fullHeight = img.height;
   delete img;
  }
  
  // some browsers have a race condition where it still doesn't get set so just fill the window
  if (fullWidth == 0 || fullHeight == 0)
  {
   var scale = Math.min(parseFloat(windowSize.x) / parseFloat(elem.width), parseFloat(windowSize.y) / parseFloat(elem.height));
   fullWidth = parseInt(elem.width * scale);
   fullHeight = parseInt(elem.height * scale);
  }         // restreindre la taille maximale
         [b][size=24] var maxwidth = maxwidth[/size][/b]
          var ratio = elem.height / elem.width 
          if (fullWidth > maxwidth) 
          fullWidth = maxwidth; 
          fullHeight = fullWidth * ratio;
 }
 // adjust window size variables for new image boundaries
 if (newLeft != null)
 {
  if (typeof newLeft == "string" && newLeft.indexOf("A") == (newLeft.length - 1))
   newLeft = parseInt(newLeft, 10);
  else
   newLeft = popBox[elem.id].xOriginal + parseInt(newLeft, 10);
   
  windowSize.x -= newLeft;
 }
 if (newTop != null)
 {
  if (typeof newTop == "string" && newTop.indexOf("A") == (newTop.length - 1))
   newTop = parseInt(newTop, 10);
  else
   newTop = popBox[elem.id].yOriginal + parseInt(newTop, 10);
   
  windowSize.y -= newTop;
 }
 // adjust for scrollbars that might appear (quick compromise for browser incompatibilities)
 if (newWidth == null && newHeight == 0 && fullWidth > (windowSize.x - 20))
  windowSize.y -= 20;
 else if (newWidth == 0 && newHeight == null && fullHeight > (windowSize.y - 4))
  windowSize.x -= 4;
 var newSize = CalculateImageDimensions(newWidth, newHeight, fullWidth, fullHeight, windowSize);
 // width and height are now set, so position it
 if (newLeft == null || newTop == null)
 {
  var scroll = GetScrollOffset();
  if (newLeft == null)
  {
   newLeft = ((windowSize.x / 2) + scroll.x) - (newSize.x / 2);
   if (newLeft < 0) newLeft = 0;
  }
  
  if (newTop == null)
  {
   newTop = ((windowSize.y / 2) + scroll.y) - (newSize.y / 2);
   if (hasRevertBar == true && popBoxRevertBarAbove == true) newTop += 10;
   if (hasCaption == true && popBoxCaptionBelow == true) newTop -= 10;
   if (newTop < 0) newTop = 0;
  }
 }
 var func = null;
 if (typeof PostPopProcessing == "function")
  func = PostPopProcessing;
 if (typeof PrePopProcessing == "function")
  PrePopProcessing(obj);
 PopBox(elem, startX, startY, newLeft, newTop, popBox[elem.id].wOriginal, popBox[elem.id].hOriginal, newSize.x, newSize.y, speed, speed, className, func);
}
// Helper function for PopBox to move/resize the image back to its original position/size. Use this! It's much easier.
function Revert(obj, speed, className)
{
 if (typeof obj == "string") obj = GetRawObject(obj);
 if (typeof popBox[obj.id] == "undefined" || popBox[obj.id] == null) return;
 if (typeof speed == 'undefined' || speed == null || speed == 0)
  speed = Math.max(popBox[obj.id].velM, popBox[obj.id].velS);
  
 if (typeof className == 'undefined')
  className = popBox[obj.id].originalClassName;
 
 var func = null;
 if (typeof PostRevertProcessing == "function")
  func = PostRevertProcessing;
 if (typeof PreRevertProcessing == "function")
  PreRevertProcessing(obj);
 PopBox(obj, popBox[obj.id].xTarg, popBox[obj.id].yTarg, popBox[obj.id].xOriginal, popBox[obj.id].yOriginal, popBox[obj.id].wTarg, popBox[obj.id].hTarg, popBox[obj.id].wOriginal, popBox[obj.id].hOriginal, speed, speed, className, func);
}

/***************************************************************************************************
* These methods are the pre and post processing events for Pop/PopEx and Revert.
* Feel free to copy them to your own page script and add your own code to the method bodies.
***************************************************************************************************/
// called before the Pop begins
// The parameter is the original object
//function PrePopProcessing(obj)
//{
//}
// called after the pop is complete
// The parameter is the copy of the object that is resized
//function PostPopProcessing(obj)
//{
//}
// called before the Revert begins
// The parameter is the copy of the object that is resized
//function PreRevertProcessing(obj)
//{
//}
// called after the Revert is complete
// The parameter is the original object
//function PostRevertProcessing(obj)
//{
//}


 


Forum
Author Message
tathan10


Offline
Guest




PostPosted: Mon 11 Jan 2010 - 17:06    Post subject: Redimensionner automatiquement les images, version 2 Reply with quote

Bonjour,

Je voudrais agrandir les images de mon forum de la même manière que sur celui-ci (http://forumautoplus.xooit.com/t4855-Beaux-die-cast-pour-amateur-de-Muscle-Car.htm)

Les images s'agrandissent et se placent au centre de la page. Cependant j'ai essayé les différents tutoriels de ce sujet mais aucun ne me mène a ce résultat.....  Pourriez-vous m'indiquer lequel suivre pour avoir un résultat similaire a ce forum ???

PS : mon thème est le subsilverplus

Merci d'avance


Author Message
Contenu Sponsorisé





PostPosted: Today at 00:30    Post subject: Redimensionner automatiquement les images, version 2

Display posts from previous:   
Reply to topic Page 13 of 17 Goto page: <  1, 2, 312, 13, 14, 15, 16, 17  >




Portal | Index | Administration Panel | Create a forum | Free support forum | Free forums directory | Report a violation | Conditions générales d'utilisation
Propulsé par p h p B B © 2016 p h p B B Group |
 
© 2003-2013 Xooit.com - Contact - Mentions légales - CGU - Charte - CNIL : 1381401