Oz Web Hub : the spot for the web design beginner

Disappearing image popper

This was designed by Boogie Jack and is a great javascript.

You just move your mouse over a link and up pops an image. Then it disappears as soon as you move your cursor away.

In this line: new_window = open ("","hoverwindow","width=300,height=200,left=20,top=120"); you can change the size of the pop-up window. Each pop-up will be the same size, so be sure to make the dimensions as large as your biggest image. In the same line you can change the position of the pop-up window when it opens. The second part of the script is encoded into each link that you want to cause a pop-up window to appear. In the example below I've used it with a text link, but it will also work with an image link so you could use thumbnails on the page, and pop-up the full-sized image. Here's how to code a link: <a href="some_page.html" onMouseOver="open_new_window('image1.jpg'); return true;" onMouseOut="close_window(); return true;">Text Link</a> If you want to use the script but don't want it linked to another page, you could use it with an image, simply use it with a font tag. Using it with an image or a font tag, nothing changes in the script in the HEAD section. Here's how I did it with a font tag: <font color="green" onMouseOver="open_new_window('your image.jpg'); return true;" onMouseOut="close_window(); return true;">Your image</font>

Back to Javascripts index

Last modified

Place at the bottom of your web page

This page was last modified: <script language="JavaScript"> document.write(document.lastModified); </script>

Link alert message

Place the following in your Head tags

Now place the following in the Body Tags.

Change the message and button text to suit.

Back to Javascripts index

straight to the top