473,606 Members | 2,115 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

looking to reproduce div popup behavior

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!
Apr 14 '06 #1
6 7272
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_di v" style="display: none;">
form stuff here
<span style="cursor:p ointer;"
onclick='docume nt.getElementBy Id("my_popup_di v").style.displ ay="none";'>clo se</span>
</div>
<span style="cursor:p ointer;"
onclick='docume nt.getElementBy Id("my_popup_di v").style.displ ay="block";'>op en</span>

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

Peter

Apr 14 '06 #2
<pe**********@g mail.com> wrote in message
news:11******** **************@ g10g2000cwb.goo glegroups.com.. .
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_di v" style="display: none;">
form stuff here
<span style="cursor:p ointer;"
onclick='docume nt.getElementBy Id("my_popup_di v").style.displ ay="none";'>clo s
e</span> </div>
<span style="cursor:p ointer;"
onclick='docume nt.getElementBy Id("my_popup_di v").style.displ ay="block";'>op e
n</span>
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.
Apr 14 '06 #3
"Bosconian" <bo*******@plan etx.com> wrote in message
news:6J******** *************** *******@comcast .com...
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/dynamici...tmltooltip.htm

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

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


Apr 21 '06 #4
Bosconian said the following on 4/21/2006 3:55 PM:
"Bosconian" <bo*******@plan etx.com> wrote in message
news:6J******** *************** *******@comcast .com...
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/dynamici...tmltooltip.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.

--
Randy
comp.lang.javas cript FAQ - http://jibbering.com/faq & newsgroup weekly
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
Apr 21 '06 #5

"Randy Webb" <Hi************ @aol.com> kirjoitti viestissä
news:Jd******** *************** *******@comcast .com...

....
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?
Apr 22 '06 #6
optimistx said the following on 4/22/2006 2:11 AM:
"Randy Webb" <Hi************ @aol.com> kirjoitti viestissä
news:Jd******** *************** *******@comcast .com...

....
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?


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

--
Randy
comp.lang.javas cript FAQ - http://jibbering.com/faq & newsgroup weekly
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
Apr 23 '06 #7

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

2
1842
by: Earl T | last post by:
I am using IE only for this control I am building. I have created a rich text box that the user can popup (using dhtml and a div tag) to allow the user to enter wiziwig html text. However, when the popup is displayed, I would like to pervent the user from clicking outside of the popup. I can get it to partially work by putting an onclick event in the body tag and setting focus back to an element of the popup. However, buttons are still...
5
14586
by: Bruce W...1 | last post by:
How does one make a flat-looking button or text field? That is with no bevelled edges, maybe just a thin line on the edge? I know you can do it with Macromedia Flash but there must be other ways. I know you could use an image button but this wouldn't have any client-side behavior like hover or mouse down. I have just about every cool software tool available. I'm just not sure of the best angle to attack this problem.
24
3232
by: jonathon | last post by:
Hi all, I have a web app with a popup window for entering data. I don't want to access the web every time this window is opened, as most of the app is AJAX. But I can't figure out how to open a new window and build it with DOM rather than having to provide a src. Even a blank.html as src takes time to fetch. How can I create a popup and dynamically add DOM content without any html at all?
3
3515
by: Phil | last post by:
Does anyone know if a modeless dialog box can be made to stay open when the parent window is closed? Maybe something to do with disabling the parent/owner? I basically need to have a popup window which is always the top most browser window, but still allows the user to continue browsing using the parent browser window (therefore any onblur=self.focus() isn't suitable), and isn't closed when the parent window is. Any ideas?
1
1253
by: Jéjé | last post by:
Hi, I'm looking for a control to open window to allow the user to search and select an item. I have one in place, but there is a lack of options and stability. So I'm looking for a control on the web. The user see a button which open the window, and after the user has selected an item (in a list), I display the selected value in a textbox (or another
9
1302
by: Mark Walsh | last post by:
The following is an explanation of a bug that exists in the VB.NET compiler. I've tried to report it to Microsoft, but they've made it so difficult I've given up: MSDN help states that variables are initialised when they are created. This seems to be true for the following code which produces "1","2","3","4","5". (ie the variable is created when a procedure is entered and not when for-loop is entered) For i = 1 To 5
10
47494
by: korund | last post by:
We can use special characters ('\n') to add line breaks in text in JavaScript popup Alert boxes. there is also few additional special characters: \' single quote \" double quote \& ampersand \\ backslash \n new line
3
1500
by: BillE | last post by:
I created a modal popup form with a button, a label, an OK Button, and a Cancel button. The first button updates the label text on postback. When I click the first button, the modal popup closes, as if I had clicked the OK or Cancel button. How can I keep the modal popup active after postback? Thanks Bill
3
10554
by: Not Me | last post by:
Hey, I'm using the MS AJAX libraries to achieve a modal popup window. Prior to using the toolkit control, I have a gridview and detailsview objects visible on the page.. when the gridview row is selected, the detailsview updates (in a seperate updatepanel - no full refresh) Now I've added the modalpopupextender and the result is that although the ok/cancel buttons on the panel appear.. the details within the detailview are blank...
0
8433
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. Here is my compilation command: g++-12 -std=c++20 -Wnarrowing bit_field.cpp Here is the code in...
1
8084
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...
0
8300
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the choice of these technologies. I'm particularly interested in Zigbee because I've heard it does some...
0
6761
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own.... Now, this would greatly impact the work of software developers. The idea...
1
5963
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms. Adolph will...
0
5461
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one. At the time of converting from word file to html my equations which are in the word document file was convert into image. Globals.ThisAddIn.Application.ActiveDocument.Select();...
0
3922
by: TSSRALBI | last post by:
Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...
1
2443
by: 6302768590 | last post by:
Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system
1
1550
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.