Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 1 of 1

Thread: Proper Syntax

  1. #1
    New to the CF scene
    Join Date
    Jan 2007
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Proper Syntax

    I'm having a little trouble with my script. I'm not sure if I am using the proper syntax for my 'popImage()' call. The function should pop up an image when a user clicks on it. It is a dynamic because I have setup my images in an array. Depending upon how I place my quotes, the page does not load pictures for display, does not popup the image onclick, or loads up the same picture when clicking different images. For the popImage() the window should automically resize itself to the picture. Here is part of my code, if you need more let me know and I will post the entire script.

    Code:
    var dimension="3x5" //Specify dimension of gallery (number of images shown), such as 4x2, 3x1 etc
    
    //Specify images:
    //galleryarray[x]=["path_to_image", "optional_title_attribute", "optional_text_description", "optional_link"]
    var galleryarray=new Array()
    galleryarray[0]=["photo_album/1.jpg", "optional title", "optional description", "photo_album/1.jpg"]
    galleryarray[1]=["photo_album/2.jpg", "optional title", "optional description", "photo_album/2.jpg"]	
    galleryarray[2]=["photo_album/3.jpg", "optional title", "optional description", "photo_album/3.jpg"]
    galleryarray[3]=["photo_album/4.jpg", "optional title", "optional description", "photo_album/4.jpg"]
    galleryarray[4]=["photo_album/5.jpg", "optional title", "optional description", "photo_album/5.jpg"]
    galleryarray[5]=["photo_album/6.jpg", "optional title", "optional description", "photo_album/6.jpg"]
    galleryarray[6]=["photo_album/7.jpg", "optional title", "optional description", "photo_album/7.jpg"]
    galleryarray[4]=["photo_album/8.jpg", "optional title", "optional description", "photo_album/8.jpg"]
    galleryarray[5]=["photo_album/9.jpg", "optional title", "optional description", "photo_album/9.jpg"]
    galleryarray[6]=["photo_album/10.jpg", "optional title", "optional description", "photo_album/10.jpg"]
    
    var href_target="_new" //Enter target attribute of links, if applicable
    
    var totalslots=dimension.split("x")[0]*dimension.split("x")[1]
    
    function buildimage(i)
    {
    	var tempcontainer=galleryarray[i][3]!=""? '<a href="javascript:popImage('+"galleryarray[i][3]"+','+"galleryarray[i][1]"+')">' : ""
    	tempcontainer+='<img src="'+galleryarray[i][0]+'" border="1" title="'+galleryarray[i][1]+'">'
    	tempcontainer=galleryarray[i][3]!=""? tempcontainer+'</a>' : tempcontainer
    	tempcontainer=galleryarray[i][2]!=""? tempcontainer+'<br \/>'+galleryarray[i][2] : tempcontainer
    	return tempcontainer
    }
    
    function jumptopage(p)
    {
    	var startpoint=(p-1)*totalslots
    	var y=1;
    	for (i=0; i<totalslots; i++)
    	{
    		document.getElementById("slide"+i).innerHTML=(typeof galleryarray[startpoint+i]!="undefined")? buildimage(startpoint+i) : ""
    	}
    	while(document.getElementById("navlink"+y)!=null)
    	{
    		document.getElementById("navlink"+y).className=""
    		y++
    	}
    	document.getElementById("navlink"+p).className="current"
    }
    
    var curimage=0
    for (y=0; y<dimension.split("x")[1]; y++)
    {
    	for (x=0; x<dimension.split("x")[0]; x++)
    	{
    		if (curimage<galleryarray.length)
    			document.write('<div id="slide'+curimage+'" class="slideshow">'+buildimage(curimage)+'</div>')
    			curimage++
    	}
    	document.write('<br style="clear: left" />')
    }
    
    for (i=1; i<Math.ceil(galleryarray.length/totalslots)+1; i++)
    	document.write('<a id="navlink'+i+'" href="javascript:jumptopage('+i+')\">Page '+i+'</a> ')
    document.getElementById("navlink1").className="current"
    
    PositionX = 100;
    PositionY = 100;
    
    // Set these value approximately 20 pixels greater than the
    // size of the largest image to be used (needed for Netscape)
    
    defaultWidth  = 500;
    defaultHeight = 500;
    
    var AutoClose = true;
    
    if (parseInt(navigator.appVersion.charAt(0))>=4)
    {
    	var isNN=(navigator.appName=="Netscape")?1:0;
    	var isIE=(navigator.appName.indexOf("Microsoft")!=-1)?1:0;}
    	var optNN='scrollbars=no,width='+defaultWidth+',height='+defaultHeight+',left='+PositionX+',top='+PositionY;
    	var optIE='scrollbars=no,width=150,height=100,left='+PositionX+',top='+PositionY;
    
    	function popImage(imageURL,imageTitle)
    	{
    	if (isNN){imgWin=window.open('about:blank','',optNN);}
    	
    	if (isIE){imgWin=window.open('about:blank','',optIE);}
    	
    	with (imgWin.document)
    	{
    		writeln('<html><head><title>Loading...</title><style>body{margin:0px;}</style>');
    		writeln('<sc'+'ript>');
    		writeln('var isNN,isIE;');
    		writeln('if (parseInt(navigator.appVersion.charAt(0))>=4){');
    		writeln('isNN=(navigator.appName=="Netscape")?1:0;');
    		writeln('isIE=(navigator.appName.indexOf("Microsoft")!=-1)?1:0;}');
    		writeln('function reSizeToImage(){');
    		writeln('if (isIE){');writeln('window.resizeTo(100,100);');
    		writeln('width=100-(document.body.clientWidth-document.images[0].width);');
    		writeln('height=100-(document.body.clientHeight-document.images[0].height);');
    		writeln('window.resizeTo(width,height);}');
    		writeln('if (isNN){');       
    		writeln('window.innerWidth=document.images["George"].width;');
    		writeln('window.innerHeight=document.images["George"].height;}}');
    		writeln('function doTitle(){document.title="'+imageTitle+'";}');
    		writeln('</sc'+'ript>');
    		if (!AutoClose) 
    			writeln('</head><body bgcolor=000000 scroll="no" onload="reSizeToImage();doTitle();self.focus()">')
    		else 
    			writeln('</head><body bgcolor=000000 scroll="no" onload="reSizeToImage();doTitle();self.focus()" onblur="self.close()">');
    		writeln('<img name="George" src='+imageURL+' style="display:block"></body></html>');
    		close();		
    	}
    }
    Last edited by litebright; 01-05-2007 at 08:28 PM.


 

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •