www.zeroonezero.com DDA CMT DDA Medical Dynamic Digital Advertising DDA Video DDA Apps DDA USA DDA SEM

JavaScript Pop-ups

About a month ago, I was given the job to add JavaScript code to HTML pages that would generate Pop-up when the user closes the window or navigates to a different one.  There were a lot of inherent problems with this idea that were known and unforeseen.  One of the problems that we knew is that in over ninety percent of the browsers for example the current versions of Internet Explorer and Firefox, Pop-ups would be blocked by default unless the user adds a special exception. To get the page to open a pop-up, I had to put a JavaScript function in the onUload of the body tag that would open a child window.  The first problem that I discovered was the onUload attribute is run every time that page is exited, refreshed, or navigated to another page.  The work around that or solution that I came up with was to disable the function from opening a pop-up when a link or button is clicked.  I did that by creating a variable in JavaScript that would be used like a Boolean variable (initialized as true) that would be tested in the onUnload JavaScript function when a link would be clicked directing the user to another page in the site, it would first set the Boolean variable to false bypassing the pop-up.  To reprogram every link in an entire page and in every page of the site would be a huge task to do. Thats where jQuery stepped in and turns the job into a simple search and replace.  The code below modifies every anchor link and submit button and sets the bool to false.
$(document).ready(function() {
$(”a”).click(function() {
flag = false;
$(”submit”).click(function() {
flag = false;
The last problem we ran into which seemed to be the toughest fix until we approached it differently was on every page there is a flash menu which did not seem to want to execute the JavaScript correctly to set the variable to false.  So, what I did was added mouse over effects to the flash menu that would set the variable to false when over the menu and set it back to true when the cursor leaves the element that the flash is in.
$(”#noflash”).mouseover(function() {
flag = false;
$(”#noflash”).mouseout(function() {
flag = true;

Share and Enjoy: These icons link to social bookmarking sites where readers can share and discover new web pages.
  • Digg
  • Sphinn
  • del.icio.us
  • Facebook
  • Mixx
  • Google
  • e-mail
  • Reddit
  • StumbleUpon
  • Furl
  • Technorati

Entry by: T-Bone


type and hit 'enter'