This is the website and I need to move images back and forth. I got this java script below but can't make out where to insert images in between the script. Let me see who can help me on this? Also I need coding for image to show larger in separate window pop-up. http://www.kheriart.com/ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Click Rollovers</title> <script type="text/javascript"> /* <![CDATA[ */ //Cross-Browser Events (required) function addEvent(elm, evType, fn) { if (elm.addEventListener) { elm.addEventListener(evType, fn, false); } else if (elm.attachEvent) { elm.attachEvent('on' + evType, fn); } else { elm['on' + evType] = fn; } } //Generic function for retrieving an event's target (required) function getTarget(e){ var target = window.event ? window.event.srcElement : e ? e.target : null; if (!target){return false;} while(target.nodeType!=1 && target.nodeName.toLowerCase()!='body'){ rel="nofollow" target=target.parentNode; } return target; } rollover = { preLoads:[], init: function () { var imgs = document.images; for( var i=0; i<imgs.length; i++ ) { //loop through the images if ( imgs.className == 'roll' ) { //if they have the 'roll' className then... var oversrc = imgs.src.replace('.', ('_on' + '.') ); //create a variable and store the on/rollover version of each image, which is the initial image's name plus the "_on" addon rollover.preLoads = new Image(); rollover.preLoads.src = oversrc; //Preload the on/rollover image addEvent( imgs, 'click', rollover.roll ); //onclick... } } }, roll: function (e) { var t = getTarget(e); var c = t.src; var ison = c.indexOf('_on'); if ( ison == -1 ) {//If the clicked image does not have the "_on" addon then... t.src = c.replace( '.', ('_on' + '.') ); //we add the "_on" addon to that clicked image } else { //else we take it out t.src = c.replace( ('_on' + '.'), '.' ); } } }; addEvent( window, 'load', rollover.init ); /* ]]> */ </script> </head> <body> <!-- There must be an image named "first_on" in your directory --> <img src="first.png" class="roll" alt="" /> <br /> <!-- There must be an image named "second_on" in your directory --> <img src="second.png" class="roll" alt="" /> <!--//Add as many as you want... ***remenber the "_on" addon//--> </body> </html>