 | |
#1
 
| |||
| |||
|
Creating a pop-over window -
10-03-2006
, 11:44 PM
#2
| |||
| |||
|
|
Hi, I am trying to create a pop-over window using HTML and JavaScript - you can see an example by clicking on the link below when you click on the orange RSS Feed icon http://about.aol.com/feeds/directory?category=money I am familiar with using pop-up windows - however, although I have searched on the web, I haven't been able to get this information. Any help will be greatly appreciated. Thanks. Chuck |
element. They are fairly easy to create. You need three things:
1) a css stylesheet, or style tag in <head>, for the element's
positioning and size etc.
2) a container element in the html document such as a div.
3) a script who's functions you call to hide and show the div
element.
/* in the stylesheet */
#myDiv {
position: absolute; /* can be relative too */
left: 100px; /* can be percentage also */
top: 100px;
width: 300px;
height: 100px;
background-color: #ff0000;
color: inherit;
}
Where myDiv is the ID of the division element. <div id="myDiv"></div>
// in Script -------
function ShowWin() {
document.getElementById('myDiv').style.visibility = 'visible';
}
function HideWin() {
document.getElementById('myDiv').style.visibility = 'hidden';
}
// ------------------
Not you call the function when the mouse is clicked on the linked image.
<a href="javascript:ShowWin()" ><img src="rss.gif" /></a>
However, in the case of the page you linked they call the onClick mouse
event handler, and set the href to a javascript void function call
(nothing). Both will do the same thing.
You can also pass the element's ID as a function argument.
HTH
Mark (c:
 |
« Previous Thread
|
Next Thread »
| Thread Tools | |
| Display Modes | |
Linear Mode
| |
Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2009, Jelsoft Enterprises Ltd.
Copyright ©2000 - 2009, Jelsoft Enterprises Ltd.