looking to reproduce div popup behavior

[Bosconian]

I'm looking to reproduce the div popup behavior like vBulletin's search
link:

http://www.vbulletin.com/forum/

I've looked at many examples, but most are complicated and/or convoluted
menu systems.

I simply want to enable a small div window containing a form with a text
input field and submit button. If the user clicks outside of the div window,
it closes.

I have already created the div containing the form. The div's default style
definition contains 'display:none' to initially hide it.

I'm now looking for a JavaScript function to enable the aforementioned
functionality.

Can someone recommend an existing function or at least point me to an
example? Thanks!

 

[petermichaux]

Hi,

Unless you want to get into some event listener stuff it is probably
easier just to have a close button inside your form to make the div
disappear.

<div id="my_popup_div" style="display:none;">
form stuff here
<span style="cursorointer;"
onclick='document.getElementById("my_popup_div").style.display="none";'>close</span>
</div>
<span style="cursorointer;"
onclick='document.getElementById("my_popup_div").style.display="block";'>open</span>

Is that good enough? If not, are you using any JavaScript libraries
that have some event listener stuff? Yahoo! UI event library?

Peter

 

[Bosconian]

Hi,

Unless you want to get into some event listener stuff it is probably
easier just to have a close button inside your form to make the div
disappear.

<div id="my_popup_div" style="display:none;">
form stuff here
<span style="cursorointer;"

onclick='document.getElementById("my_popup_div").style.display="none";'>clos

</div>
<span style="cursorointer;"

onclick='document.getElementById("my_popup_div").style.display="block";'>ope

Is that good enough? If not, are you using any JavaScript libraries
that have some event listener stuff? Yahoo! UI event library?

Peter

This should get me particially there--thanks.

 

[Bosconian]

I'm looking to reproduce the div popup behavior like vBulletin's search
link:

http://www.vbulletin.com/forum/

I've looked at many examples, but most are complicated and/or convoluted
menu systems.

I simply want to enable a small div window containing a form with a text
input field and submit button. If the user clicks outside of the div window,
it closes.

I have already created the div containing the form. The div's default style
definition contains 'display:none' to initially hide it.

I'm now looking for a JavaScript function to enable the aforementioned
functionality.

Can someone recommend an existing function or at least point me to an
example? Thanks!

This is just a quick follow-up to my original post.

I have discovered a few useful links that provide information regarding
dynamic popups.

The first is probably the best known and most popular, overlib:

http://www.bosrup.com/web/overlib/

The second is a simple and limited example, but provides the core
functionality without the bloat:

http://www.dynamicdrive.com/dynamicindex5/dhtmltooltip.htm

The third provides the same features as overlib, by weighs in at a fraction
of the size:

http://migoicons.tripod.com/dhtips.htm

 

[Randy Webb]

Bosconian said the following on 4/21/2006 3:55 PM:

This is just a quick follow-up to my original post.

I have discovered a few useful links that provide information regarding
dynamic popups.

The first is probably the best known and most popular, overlib:

http://www.bosrup.com/web/overlib/

The second is a simple and limited example, but provides the core
functionality without the bloat:

http://www.dynamicdrive.com/dynamicindex5/dhtmltooltip.htm

The third provides the same features as overlib, by weighs in at a fraction
of the size:

http://migoicons.tripod.com/dhtips.htm

And this one:

<URL: http://www.litotes.demon.co.uk/js_info/pop_ups.html >

Beats them all.

 

[optimistx]

"Randy Webb" <[email protected]> kirjoitti viestissä

....

And this one:

<URL: http://www.litotes.demon.co.uk/js_info/pop_ups.html >

Beats them all.

....

Thanks for the link. It is an interesting set of pages. At first glance I
did not find any license agreement, download instructions, documentation of
the code. Is this supposed to be ready to be copied and used by anyone for
any purpose?

 

[Randy Webb]

optimistx said the following on 4/22/2006 2:11 AM:

"Randy Webb" <[email protected]> kirjoitti viestissä

....

....

Thanks for the link. It is an interesting set of pages. At first glance I
did not find any license agreement, download instructions, documentation of
the code. Is this supposed to be ready to be copied and used by anyone for
any purpose?

You would have to ask Richard Cornford about that, it is his code.