New Features

• Improved installation documentation


• Simplified the installation process


• Added ability to resize based on a fixed size or a fraction of the visitors screen size.


• Simplified the alignment of the "Close Pop-up" text


• Changed pop-up window positioning and added left and top alignment config


• Added code so that pop-ups now work with Netscape 6+


• Added new "forum code" tag that allows users to bypass the auto-resize function (like for signatures).


• Fixed bug where images fail to resize when the page is refreshed


• Added configurable option to show original pic in new window (Thanks to DavidRhodes)

quote:

---

~ Fixed bug where images fail to resize when the page is
refreshed

---

quote:

---

Originally posted by DavidRhodes
Found it, people may have problems with conflicting onLoad events using this.

---

quote:

---

Originally posted by DavidRhodes
Just a suggestion, it would be nice if rather than resizing into a layer, there was an option to popup a new window with the image in (maybe a modal-dialog?)

---

var fixedWidth     = 400;  // Resize the image if it is wider than this many 
                           // pixels. Only used when resizeType = 1.

var enlargeType = 1 // 0 = Opens in the same window
			// 1 = Opens in a new window

function enlargeimg(which,e){
    if (resizeType == 0) fixedWidth = parseInt(screen.width/dynamicDivisor);
	if (which.width < fixedWidth) {return false;}
	if (enlargeType == 0) {
		if (ie||ns6){
			crossobj=document.getElementById? document.getElementById("showimage") : document.all.showimage
			if (crossobj.style.visibility=="hidden"){
				crossobj.style.left = (ns6? pageXOffset : document.body.scrollLeft) + leftSpacing
				crossobj.style.top  = (ns6? pageYOffset : document.body.scrollTop) + topSpacing
			    alignRE = /^left$/i
				crossobj.innerHTML= (alignRE.test(alignClose))? '<div class=tvhead align=left id=drag> <span class=tvclosex onClick=closepreview() style=cursor:pointer> X </span> <span class=tvclose onClick=closepreview()>Close</span> </div><img src="'+which.src+'">' : '<div class=tvhead align=right id=drag> <span class=tvclose onClick=closepreview()>Close</span> <span class=tvclosex onClick=closepreview() style=cursor:pointer> X </span> </div><img src="'+which.src+'">';
				crossobj.style.visibility="visible"
			}
			else
				crossobj.style.visibility="hidden"
				return false
		}
		else if (document.layers){
			if (document.showimage.visibility=="hide"){
				document.showimage.document.write('<a href="#" onMouseover="drag_dropns(showimage)"><img src="'+which.src+'" border=0></a>')
				document.showimage.document.close()
				document.showimage.left=e.x
				document.showimage.top=e.y
				document.showimage.visibility="show"
			}
			else
				document.showimage.visibility="hide"
				return false
		}
		else
		return true
	}
	else if (enlargeType == 1) {
		if (document.all&&window.print) //if ie5
			eval('window.showModelessDialog(which.src,"","help:0;resizable:1;dialogWidth:'+which.width+'px;dialogHeight:'+which.height+'px")')
		else
			eval('window.open(which.src,"","width='+which.width+'px,height='+which.height+'px,resizable=1,scrollbars=1")')
	}
}

function enlargeimg(which,e){
    if (resizeType == 0) fixedWidth = parseInt(screen.width/dynamicDivisor);
	if (which.width < fixedWidth) {return false;}
	if (enlargeType == 0) {
		if (ie||ns6){
			crossobj=document.getElementById? document.getElementById("showimage") : document.all.showimage
			if (crossobj.style.visibility=="hidden"){
				crossobj.style.left = (ns6? pageXOffset : document.body.scrollLeft) + leftSpacing
				crossobj.style.top  = (ns6? pageYOffset : document.body.scrollTop) + topSpacing
			    alignRE = /^left$/i
				crossobj.innerHTML= (alignRE.test(alignClose))? '<div class=tvhead align=left id=drag> <span class=tvclosex onClick=closepreview() style=cursor:pointer> X </span> <span class=tvclose onClick=closepreview()>Close</span> </div><img src="'+which.src+'">' : '<div class=tvhead align=right id=drag> <span class=tvclose onClick=closepreview()>Close</span> <span class=tvclosex onClick=closepreview() style=cursor:pointer> X </span> </div><img src="'+which.src+'">';
				crossobj.style.visibility="visible"
			}
			else
				crossobj.style.visibility="hidden"
				return false
		}
		else if (document.layers){
			if (document.showimage.visibility=="hide"){
				document.showimage.document.write('<a href="#" onMouseover="drag_dropns(showimage)"><img src="'+which.src+'" border=0></a>')
				document.showimage.document.close()
				document.showimage.left=e.x
				document.showimage.top=e.y
				document.showimage.visibility="show"
			}
			else
				document.showimage.visibility="hide"
				return false
		}
		else
		return true
	}
	else if (enlargeType == 1) {
		var tmpImg = new Image();
		tmpImg.src = which.src;
		if (document.all&&window.print)
			eval('window.showModelessDialog(which.src,"","help:0;resizable:1;dialogWidth:'+tmpImg.width+'px;dialogHeight:'+tmpImg.height+'px")')
		else
			eval('window.open(which.src,"","width='+tmpImg.width+'px,height='+tmpImg.height+'px,resizable=1,scrollbars=1")')
	}
}

function enlargeimg(which,e){
    if (resizeType == 0) fixedWidth = parseInt(screen.width/dynamicDivisor);
	if (which.width < fixedWidth) {return false;}
	if (enlargeType == 0) {
		if (ie||ns6){
			crossobj=document.getElementById? document.getElementById("showimage") : document.all.showimage
			if (crossobj.style.visibility=="hidden"){
				crossobj.style.left = (ns6? pageXOffset : document.body.scrollLeft) + leftSpacing
				crossobj.style.top  = (ns6? pageYOffset : document.body.scrollTop) + topSpacing
			    alignRE = /^left$/i
				crossobj.innerHTML= (alignRE.test(alignClose))? '<div class=tvhead align=left id=drag> <span class=tvclosex onClick=closepreview() style=cursor:pointer> X </span> <span class=tvclose onClick=closepreview()>Close</span> </div><img src="'+which.src+'">' : '<div class=tvhead align=right id=drag> <span class=tvclose onClick=closepreview()>Close</span> <span class=tvclosex onClick=closepreview() style=cursor:pointer> X </span> </div><img src="'+which.src+'">';
				crossobj.style.visibility="visible"
			}
			else
				crossobj.style.visibility="hidden"
				return false
		}
		else if (document.layers){
			if (document.showimage.visibility=="hide"){
				document.showimage.document.write('<a href="#" onMouseover="drag_dropns(showimage)"><img src="'+which.src+'" border=0></a>')
				document.showimage.document.close()
				document.showimage.left=e.x
				document.showimage.top=e.y
				document.showimage.visibility="show"
			}
			else
				document.showimage.visibility="hide"
				return false
		}
		else
		return true
	}
	else if (enlargeType == 1) {
		var tmpImg = new Image();
		tmpImg.src = which.src;
		var width = tmpImg.width + 6;
		var height = tmpImg.height + 45;
		if (document.all&&window.print) //if ie5			
			eval('window.showModelessDialog(tmpImg.src,"","help:0;resizable:0;dialogWidth:'+width+'px;dialogHeight:'+height+'px")')
		else{
			eval('window.open(tmpImg.src,"","width='+width+'px,height='+height+'px,resizable=1,scrollbars=1")')
		}
	}
}

function enlargeimg(which,e){
    if (resizeType == 0) fixedWidth = parseInt(screen.width/dynamicDivisor);
	if (which.width < fixedWidth) {return false;}
	if (enlargeType == 0) {
		if (ie||ns6){
			crossobj=document.getElementById? document.getElementById("showimage") : document.all.showimage
			if (crossobj.style.visibility=="hidden"){
				crossobj.style.left = (ns6? pageXOffset : document.body.scrollLeft) + leftSpacing
				crossobj.style.top  = (ns6? pageYOffset : document.body.scrollTop) + topSpacing
			    alignRE = /^left$/i
				crossobj.innerHTML= (alignRE.test(alignClose))? '<div class=tvhead align=left id=drag> <span class=tvclosex onClick=closepreview() style=cursor:pointer> X </span> <span class=tvclose onClick=closepreview()>Close</span> </div><img src="'+which.src+'">' : '<div class=tvhead align=right id=drag> <span class=tvclose onClick=closepreview()>Close</span> <span class=tvclosex onClick=closepreview() style=cursor:pointer> X </span> </div><img src="'+which.src+'">';
				crossobj.style.visibility="visible"
			}
			else
				crossobj.style.visibility="hidden"
				return false
		}
		else if (document.layers){
			if (document.showimage.visibility=="hide"){
				document.showimage.document.write('<a href="#" onMouseover="drag_dropns(showimage)"><img src="'+which.src+'" border=0></a>')
				document.showimage.document.close()
				document.showimage.left=e.x
				document.showimage.top=e.y
				document.showimage.visibility="show"
			}
			else
				document.showimage.visibility="hide"
				return false
		}
		else
		return true
	}
	else if (enlargeType == 1) {
			eval('window.open("showpic.asp?pic=' + which.src + '","","width='+which.width+'px,height='+which.height+'px,resizable=1,scrollbars=0")')
	}
}

<html>
<head>
	<title>Pic: <%= request.querystring("pic") %></title>
	<script language="javascript">
    /*****
    * [resizewin.js] v2.1
    * 2001-08-05
    * Author: Anarchos
    * E-mail: anarchos3@hotmail.com
    * URL: http://anarchos.xs.mw/
    ***/
    
    function resizeWin(maxX,maxY,speed,delay,win){
    	this.obj = "resizeWin" + (resizeWin.count++);
    	eval(this.obj + "=this");
    	if (!win)     this.win = self;    else this.win = eval(win);
    	if (!maxX)    this.maxX = 400;    else this.maxX = maxX;
    	if (!maxY)    this.maxY = 300;    else this.maxY = maxY;
    	if (!speed)   this.speed = 1/2;   else this.speed = 1/speed;
    	if (!delay)   this.delay = 0;    else this.delay = delay;
    	this.doResize = (document.all || document.getElementById);
    	this.stayCentered = false;
    	
    	this.initWin = 	function(){
    		if (this.doResize){
    			this.resizeMe();
    			}
    		else {
    			this.win.resizeTo(this.maxX + 10, this.maxY - 20);
    			}
    		}
    
    	this.resizeMe = function(){
    		this.win.focus();
    		this.updateMe();
    		}
    	
    	this.resizeTo = function(x,y){
    		this.maxX = x;
    		this.maxY = y;
    		this.resizeMe();
    		}
    		
    	this.stayCentered = function(){
    		this.stayCentered = true;
    		}
    
    	this.updateMe = function(){
    		this.resizing = true;
    		var x = Math.ceil((this.maxX - this.getX()) * this.speed);
    		var y = Math.ceil((this.maxY - this.getY()) * this.speed);
    		if (x == 0 && this.getX() != this.maxX) {
    			if (this.getX() > this.maxX) x = -1;
    			else  x = 1;
    			}
    		if (y == 0 && this.getY() != this.maxY){
    			if (this.getY() > this.maxY) y = -1;
    			else y = 1;
    			}
    		if (x == 0 && y == 0) {
    			this.resizing = false;
        		}
    		else {
    			this.win.top.resizeBy(parseInt(x),parseInt(y));
    			if (this.stayCentered == true) this.win.moveTo((screen.width - this.getX()) / 2,(screen.height - this.getY()) / 2);
    			setTimeout(this.obj + '.updateMe()',this.delay)
    			}
    		}
    		
    	this.write =  function(text){
    		if (document.all && this.win.document.all["coords"]) this.win.document.all["coords"].innerHTML = text;
    		else if (document.getElementById && this.win.document.getElementById("coords")) this.win.document.getElementById("coords").innerHTML = text;
    		}
    		
    	this.getX =  function(){
    		if (document.all) return (this.win.top.document.body.clientWidth + 10)
    		else if (document.getElementById)
    			return this.win.top.outerWidth;
    		else return this.win.top.outerWidth - 12;
    	}
    	
    	this.getY = function(){
    		if (document.all) return (this.win.top.document.body.clientHeight + 29)
    		else if (document.getElementById)
    			return this.win.top.outerHeight;
    		else return this.win.top.outerHeight - 31; 
    	}
    	
    	this.onResize =  function(){
    		if (this.doResize){
    			if (!this.resizing) this.resizeMe();
    			}
    		}
    
    	return this;
    }
    resizeWin.count = 0;
	</script> 
</head>
<body bgcolor=#cccccc onLoad="booyah.initWin()" onResize="booyah.onResize()" marginwidth="0" marginheight="0" leftmargin="0" rightmargin="0" topmargin="0" bottommargin="0">
<img name=img src="<%= request.querystring("pic") %>" border=0>
<script>
if (document.images){
    if (document.all&&window.print)
    	booyah = new resizeWin(document["img"].width+12,document["img"].height+31);
    else
    	booyah = new resizeWin(document["img"].width+8,document["img"].height+36);
	booyah.stayCentered();
}
</script> 
</body>
</html>