I am using the dhtml window widget script found here:
http://www.dynamicdrive.com/dynamicindex8/dhtmlwindow/index.htm
I would like for the user to be able to close the dhtml popup window when clicking the background. Currently it only works when clicking the close button. How do I add that to this script?
This is NOT for "dhtmlmodal" as the subject says. This is for "dhtmlwindow". There IS a difference as "dhtmlmodal" does not even seem to have a .close() event, only a .hide()
That widget is quite old now (over 6 years) and there are no doubt numerous newer, better alternatives, but that's besides the point.
The documentation on the page you linked to details how to create the popup, and then how to access functions that act on the pop up. Copied below for reference:
Create links that manipulate an opened window in various ways when clicked on
<script type="text/javascript">
// this function invocation generates the popup with your specific parameters
// the variable name you assign (googlewin) is used to interact with the popup later
var googlewin=dhtmlwindow.open("googlebox", "iframe", "http://google.com", "Google Web site", "width=700px,height=450px,resize=1,scrolling=1,center=1", "recal")
</script>
<!-- this is an example link that will call the close method on the googlewin object
this is the bit you need to apply to whatever it is that you want the visitor to be able to click on to close the popup -->
Close Window
Bear in mind that the widget you are using creates a popup window, not a true modal. If you were to use a modal (lightbox) you would have built in close functionality whenever the visitor clicked anywhere outside of the main modal content area.
Related
I am creating a program where i use popup with the help of javascript window.open(). It is working fine but i want to make it sticky popup. Here i try make you understand what i'm looking for. For ex. I have page called add_data.php in this page i have button called upload picture when i click upload picture button a popup appears where pircture can b uploaded. But i dont want to user allow to do anything on other tabs until upload picture tab is completed or closed. In other words i want to stick the picture upload popup.
There is no way to make a new browser window modal.
People doing this sort of thing generally use DOM manipulation to display new UI elements on top of the current page (which block accesses to the rest of the page using overlays and methods to disable access with the tab key etc).
There are lots of JavaScript libraries / UI frameworks that provide a modal.
first of all, sorry for my bad english.
I would like to create a "like-close" button for my site. Now I'll explain what I mean.
I've created 2 div, 1 for an overlay background in all the browser window and one for a window where I ask users to "Like" my facebook page.
I have also created a close button for hide the 2 divs and in this button I have hidden another Facebook Like Button and, when a user try to close the popup, he will put a "Like". In this button I wrote "close and like" so, for who thinks It's a clickjacking, the users know what they are doing.
I've been able to close the window in the same moment when the user click on the button on the first time (so, before he didn't like my page) with the method
FB.Event.subscribe('edge.create', function(response) {
jQuery('#overlay').hide(); //hide the overlay
jQuery('#popoup').hide(); //hide the popup window
});
Now when he visit my page again, the popup will appear again and I don't know how to close it without "dislike" the page.
I tried to bind an event "click" in the iframe of like button but it didn't work.
I tried to bind an event in the wrapper of the iframe but it didn't work...
So I have no more ideas and I know it's possibile because I saw this trick in another web site.
Thank you all for help
Sorry, in the button where I hide the Facebook like I wrote "like and close". It's the only button in the Window for show the main page content just to fans.
I currently have a custom dialog within the link plugin that launches a popup with all the internal pages on my CMS for the user to pick and it inputs the url into the box
{type:'button',id:'browseInternal',label:i.browseWebsite,filebrowser:{action:'Browse',url:'/admin/pages/links'}}
However, I now use a popup modal window all over my system and would like the same modal style window to be used here. Any ideas on how I can implement it? I dont want to launch a popup window but instead the button needs to call this function
loadPopup( '/admin/pages/links', '', 'destination' );
After gathering my thoughts and a little more help from Google I eventially found the right page on the CKeditor docs see here
I'm having an issue with a our main application's window activating itself when the mouse is hovered over it.
I'm opening the new window in a javascript function using the line below:
window.open(URL, 'Requests', 'location=no,toolbar=no,status=yes,scrollbars=yes,resizable=yes');
I have noticed that if I open a new IE window through Explorer, hovering over our main application's window does not reactivate itself. Even in this case though, the main window does make itself be "on top" of the pop-up window created by the window.open command above.
The question is this: Is there any way, when opening a "child" window in javascript, to detach the child window from the parent?
Further info: I am using an Infragistics WebDataMenu with ActivateOnHover set to true so users don't need to click on main menu items to see sub-menu choices. Unfortunately, that setting sensitizes the whole menu bar so that sliding the mouse through it activates the menu (and sadly the window when a popup is active). This is the root behavior I'm trying to fix.
The window.open(); method will create a popup window that really only shares a relationship through JavaScript via the return value of the call, and the window.opener property on the popup window.
What you want is the behavior of a modal window that locks out interaction from the 'parent' page while you work on the 'child' popup.
You can try to fight with JavaScript (and your users) by forcing a focus on the popup and blocking any blurring but this will drive users nuts when they want to go read their email etc. (eg not recommended)
You can also use the not so standard showModalDialog(); method but support is far from fully cross browser and there are a whole bunch of new problems if you try to use this (no right click in IE, zoom issues in IE, and no grandchildren popups to name a few) (again not recommended)
What you can do is make an "overlay" popup similar to many online photo viewers where you first overlay a mask (typically semi transparent) that blocks mouse/focus on the entire page content below and then overlay that with your "popup content". Just be sure that you provide a close option that removes the mask when the overlay is closed/done.
Note if you need to support IE6 you'll also need an iframe shim (Google if needed)
Many UI frameworks will provide a "dialog" just like this for you. (Eg jQueryUI)
Ultimately, I gave up on making this work. I found that what I had to do was turn off ActivateOnHover from the WebDataMenu, which didn't answer this question and requires users to click on the menu to make it drop down, but it became a work-around.
I want to display 2 modal windows containing HTML content with jQuery.
But second modal window must be within the first.
So, here is main page, when I click link it opens first modal window, and then when I click a link in this modal window in opens second modal window.
I tried to do this with qTip, but I can't make second modal window.
I will be appreciate if somebody tells me how can I realize this. Thanks.
To me this sounds like an ui failure - modals within modals are not healthy for a user interface, and thus modal frameworks rarely support it.
If i was you I'd find another design rather than solve this problem programatically
I'd recommend the jQuery UI Modal Dialog, it should allow having two dialogs open at the same time.
qTip allows to open modal in modal.
Something is going wrong with your code.
Post it here and i can give you a solution!