473,320 Members | 1,950 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,320 software developers and data experts.

How to create a "dialog box" by a layer(div) ?

For example,
There is a article on a simple html, a button is place on the bottom of
the article.
When the button is onclick, a table is shown on the top of page, and
all the text,
or any form controls at the background cannot be foucs, or select
anymore.
It just like all the things at backgound is diabled and viewing gray.

Aug 2 '06 #1
4 9567
Cylix wrote:
For example,
There is a article on a simple html, a button is place on the bottom
of the article.
When the button is onclick, a table is shown on the top of page, and
all the text,
or any form controls at the background cannot be foucs, or select
anymore.
It just like all the things at backgound is diabled and viewing gray.
There are a few different libs which do this. Yahoo's library, for example.

I have example code which I am preparing to release which makes these "in
page" popups easy to create:
http://www.javascripttoolbox.com/lib/popup/example.php

This is a pre-release example, and the "Modal Popups" at the bottom are
similar to what you describe.

Note: The code in the example has been updated to fix bugs and add
enhancements since it was posted. The example is not production-ready code.

--
Matt Kruse
http://www.JavascriptToolbox.com
http://www.AjaxToolbox.com
Aug 2 '06 #2
I also know this effect is provided in many javascript "toolkit",
May I know the way of the concept to do so?

Aug 2 '06 #3
Hi Matt,

Matt Kruse wrote:

<snip>
This is a pre-release example, and the "Modal Popups" at the bottom are
similar to what you describe.

Note: The code in the example has been updated to fix bugs and add
enhancements since it was posted. The example is not production-ready code.
I like the semi-transparent layer. Looks really good. However, I noticed
that, while it blocks the mouse inputs to the main document, it doesn't
prevent me from using the keyboard to select a link and "click" it by
pressing enter (tested in Firefox 1.5.0.5). Any idea how to solve this?

Greetings,
Laurent
--
Laurent Bugnion, GalaSoft
Software engineering: http://www.galasoft-LB.ch
PhotoAlbum: http://www.galasoft-LB.ch/pictures
Support children in Calcutta: http://www.calcutta-espoir.ch
Aug 2 '06 #4
Laurent Bugnion wrote:
I like the semi-transparent layer. Looks really good. However, I
noticed that, while it blocks the mouse inputs to the main document,
it doesn't prevent me from using the keyboard to select a link and
"click" it by pressing enter (tested in Firefox 1.5.0.5). Any idea
how to solve this?
I've thought about this too, especially when the popup has a form and you
tab out of it into the main document.

I considered adding keyboard event-handlers to block that on the main
document, but decided that it's probably not worth it. If someone wants to
try that bad to thwart the "modal" popup, then they could also type in
arbitrary javascript: into the url to un-modal it anyway ;)

--
Matt Kruse
http://www.JavascriptToolbox.com
http://www.AjaxToolbox.com
Aug 2 '06 #5

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

Similar topics

13
by: Dan R Brown | last post by:
I have a large form that is generated dynamically in a jsp using xml / xslt. So, to break up this form into several "tabbed" sections, I break up the form using <div> tags. Each <div...
5
by: Thomas Hoheneder | last post by:
Hello, I have a web page that contains the following things. 1) Lots of text, so that the page is longer/higher than one browser screen. 2) Within that text there is an input text field. 3) On...
7
by: calan | last post by:
I need a dialog box with Yes, No, and Cancel buttons that pops up when a link is clicked. I'm using asp on the server side, and basically, if the user clicks yes, I want to go to a certain page...
3
by: Adam Toline | last post by:
In reference to the following: http://www.bellecose.com/form.htm At the top of each column there is a box for "All". When one is checked I need to check all of (and only) those boxes...
2
by: mstearne | last post by:
Has anyone seen any Javascript that mimics the effect that allows you to browse through the New Releases, Just Added sections of the iTunes Music Store? Where you click the arrow icon and the next...
2
by: Arnost Sobota | last post by:
Hello, Suppose I want to play with DIVs as if they were type characters. I have a series of fixed-height (width is of no importance) blocks which must follow one another from left to right, with...
4
by: john | last post by:
Hi to All, I am new to html authoring, so sorry if my terminology is not correct or exact. I would like to position a footer div to the bottom of the browser window. As I research in the web...
1
by: pbd22 | last post by:
Hi all. I am using styles to lock down the GUI until the user enters some info in a CSS/DIV pop box. If the user does now scroll before he clicks, the pop box is centered and the background...
1
by: =?Utf-8?B?Sm9obiBXYWxrZXI=?= | last post by:
Hi, I have a webpage designed with asp.net 2.0. Is there a way to display a "please wait" message to the screen horizontally centered and veritcally 20px from the VISIBLE top of the page,...
0
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
0
by: Vimpel783 | last post by:
Hello! Guys, I found this code on the Internet, but I need to modify it a little. It works well, the problem is this: Data is sent from only one cell, in this case B5, but it is necessary that data...
0
by: jfyes | last post by:
As a hardware engineer, after seeing that CEIWEI recently released a new tool for Modbus RTU Over TCP/UDP filtering and monitoring, I actively went to its official website to take a look. It turned...
0
by: ArrayDB | last post by:
The error message I've encountered is; ERROR:root:Error generating model response: exception: access violation writing 0x0000000000005140, which seems to be indicative of an access violation...
1
by: PapaRatzi | last post by:
Hello, I am teaching myself MS Access forms design and Visual Basic. I've created a table to capture a list of Top 30 singles and forms to capture new entries. The final step is a form (unbound)...
0
by: Defcon1945 | last post by:
I'm trying to learn Python using Pycharm but import shutil doesn't work
1
by: Shællîpôpï 09 | last post by:
If u are using a keypad phone, how do u turn on JavaScript, to access features like WhatsApp, Facebook, Instagram....
0
by: Faith0G | last post by:
I am starting a new it consulting business and it's been a while since I setup a new website. Is wordpress still the best web based software for hosting a 5 page website? The webpages will be...
0
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 3 Apr 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 former...

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.