homepage Welcome to WebmasterWorld Guest from
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member
Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
Forum Library, Charter, Moderator: open

JavaScript and AJAX Forum

Modal Window Redirect

 2:23 am on Feb 28, 2012 (gmt 0)

Hello all..

I have a modal window that I'd like to make clickable - ie, the user clicks anywhere in the window and it takes them to the website....not just closes the window, but takes them to another website (the new one!) Even if they click the close button, it needs to redirect to the new. (I didn't invent this idea, I'm just trying to do what they asked!)
Here's the test page..

I tried to make the page clickable -
onClick="document.location.href='http://www.google.com';" in the body tag, then in the table tag, but no go.

Is there anything that can close the modal window AND redirect to the new site?

thanks in advance




 5:46 am on Feb 28, 2012 (gmt 0)

For starters try

in main page add function to do the work

function doWork() {
// code to close popup ?

in popup



 2:40 pm on Feb 28, 2012 (gmt 0)

ok...tried that ..i added in
<script type="text/javascript">
function doWork() {
// code to close popup ?

to the head in the main document and
<body onclick="window.opener.doWork();">
to the modal window.

but it didn't work. Even added the link to the graphics but then it just loads the google.com website into the modal window frame itself, doesn't break out of the modal window at all...

help? =)


 4:57 pm on Feb 28, 2012 (gmt 0)

Keep banging around at it, you've got the right tools and will get it. :-)

- Base window has code to open new (modal?) window.
- New window opens. From that window set main window's location: window.opener.document.location
- from the popup window, close (window.close() will close CURRENT window.)

Don't use inline event handlers, esp. on body (go ahead to get it working, but it's not needed.) Use something the users will understand and recognize:

<a id="the-link" href="some-meaningful-url.html">Go</a>

<script type="text/javascript">
window.onload=function() {
document.getElementById('the-link').onclick=function() { return doSomething(); };

function doSomething() {
alert('do something');
return false;


Or a form:

<form action="some-meaningful-action.php" id="the-form">
<input type="submit" value="go">

window.onload=function() {
document.getElementById('the-form').onsubmit=function() { return doSomething(); };


 12:40 am on Feb 29, 2012 (gmt 0)

but it didn't work

Make sure you have error reporting turned on, you should to least get an error indication.

Try alert in doWork ?

Note that security restrictions apply ( same origin policy ) if frame content from different domain than main page.

Global Options:
 top home search open messages active posts  

Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved