PDA

View Full Version : Popup Window with Rollover Image. Help!!!



daveyboy1984
09-16-2008, 01:07 PM
Hiya, I new to this forum, but getting really into scripts although I am rubbish at them. I have a rollover image which I want to open up a new centred window of a certain size when someone clicks on it.

I have looked all over and it seems all i can find is code for text, and when I try and incorporate it into the image code it doesn't work.

In the new window I want a movie file to load and ideally have a background image aswell.

Heres the code:
<a href="march.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image8','','march3small.jpg',1)"><img src="march2small.jpg" name="Image8" width="300" height="180" border="0" id="Image8" /></a></div>

So I want it to open the window march.html when someone clicks on the rollover image.

Is this possible? Any help would be great.

Cheers...

jscheuer1
09-16-2008, 02:46 PM
The background image in the new window will be the background image of march.html page. If you have code that will open a new window like you want, what is it? It can be applied to the link as an onclick event. Something like (in the head):


<script type="text/javascript">
<!--
/****************************************************
Author: Eric King
Url: http://redrival.com/eak/index.shtml
This script is free to use as long as this info is left in
Featured on Dynamic Drive script library (http://www.dynamicdrive.com)
****************************************************/
var win=null;
function NewWindow(mypage,myname,w,h,scroll,pos){
if(pos=="random"){LeftPosition=(screen.width)?Math.floor(Math.random()*(screen.width-w)):100;TopPosition=(screen.height)?Math.floor(Math.random()*((screen.height-h)-75)):100;}
if(pos=="center"){LeftPosition=(screen.width)?(screen.width-w)/2:100;TopPosition=(screen.height)?(screen.height-h)/2:100;}
else if((pos!="center" && pos!="random") || pos==null){LeftPosition=0;TopPosition=20}
settings='width='+w+',height='+h+',top='+TopPosition+',left='+LeftPosition+',scrollbars='+scroll+',resizable=yes';
win=window.open(mypage,myname,settings);
};
// -->
</script>

Then for your link:


<a href="march.html" onclick="NewWindow(this.href,'_blank','400','350','yes','center');return false"
onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image8','','march3small.jpg',1)"
><img src="march2small.jpg" name="Image8" width="300" height="180" border="0" id="Image8" /></a>