Jump to content

How can expand image in popup


idsanjeev

Recommended Posts

HiHow can expand image in popup window on mouseover from fade in image .i haven't idea to how can show the image on mouse over in new popup windowmy code for popup winow is

function new_window(){	new_window = open("","","width=300,height=200,left=10,top=10");new_window.document.open(); // Text of the new document// Replace your " with ' or \" or your document.write statements will failnew_window.document.write("<html><title>JavaScript New Window</title>");new_window.document.write("<body bgcolor=\"#FFFFFF\">");new_window.document.write("This is a new html document created by JavaScript ");new_window.document.write("statements contained in the previous document.");new_window.document.write("</body></html>");// close the documentnew_window.document.close(); }function close_window() {new_window.close();}

thanks

Link to comment
Share on other sites

Opening new windows on mouseover would be a terrible thing to do, and most popup blockers would probably stop it. Don't open an entirely new browser window, create a new div (or use a hidden one already on the page) and position it using CSS and Javascript. It can follow the mouse pointer, hide when you mouse out, etc. There are several scripts made to do that. Check at walterzorn.com for his tooltip library, it will probably do what you want. You can also try dynamicdrive.com.

Link to comment
Share on other sites

my proplems due to frame i am using some frame at top,left ceter and right in right frame image disply in fadein so when the mouseover on image, image is expanded in thats frame but not more space to display it in that frame so my need is open a new winodwi try to these two code

<script language="javascript">//Function to open PopupWindow and Close PopupWindowfunction new_window(){	new_window = open('fader.asp','new','width=500,height=450,left=  10,top=10');} function close_window() {new_window.close();} </script> <div style="position:absolute; top:0; left:0 "> <!--Link for opne popup wondow <a onmouseover="window.open('fader.asp','Popup_Window','toolbar=no  ,location=no,directories=no,status=no,menubar=no,s  crollbars=no,resizable=no,copyhistory=no,width=475  px,height=420px,top=30,left=20')"  >--> <img src="images/1.jpg" id="new" onMouseOver="new_window()" onMouseOut="close_window()" name='SlideShow' border="5px" style="border-color:#B812A7 " width="170PX"  height="140PX"  title="Click to Magnifying Image"><!--</a>--></div>

But when first time mouse over on image popup window is opend and onmouseout closed but not more without page refresh means it works only one time when mouse over on image after first time error is at line 21 where <img src.............>line:-21char:-1error:-the callee[server[not server application]]is not available and disappeared; all connection are invalid. the call did not execute.I am creating link onmouseover image window is open but it not close on mouseout I try with these two to open new window onmouseover and close on mouseoutthanks

Link to comment
Share on other sites

You have a variable the same name as a function, and you overwrite the function the first time you run it.

function new_window(){	new_window = open('fader.asp','new','width=500,height=450,left=  10,top=10'); // now new_window is a window object instead of a function}

Use a different variable or function name. You'll also want to use a global variable for the window, so declare the variable with var at the top of the script.

Link to comment
Share on other sites

HiThats great

<script language="javascript"> //Function to open PopupWindow and Close PopupWindow function   new_window() {   my_window = window.open('fader.asp','new','width=500,height=450,left=10,top=10');   }   function close_window() {   my_window.close();   }   </script>

thanks

Link to comment
Share on other sites

You can use that code and change it to onmouseover instead of onclick if you want, but onmouseover does something else there.
Thanks justsomeguyi got it working by using this code
<script type="text/javascript">var my_window;function new_window(ImageURL1) { my_window = window.open(ImageURL1, 'new', 'height=400,left=10,top=10');   }  function close_window() {   my_window.close();   } </script> <img src="images/1.jpg" onmouseover="new_window(this.src)" onMouseOut="close_window()" name='SlideShow' border="5px" style="border-color:#B812A7 " width="170px"  height="140px"  title="Click to Magnifying Image">

thanks

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...