Author: ad_mtk2 | Website: http://adland.united.net.kg

The Smart Pop-up!

This is a tutorial that is going to take you through a step by step process to show you how to make your very own Smart pop-up. The first thing that is required is the index page where the pop-up will open from. Put the following code in the '<%lt%>Head<%gt%>' tags of the index page:

<%lt%>html<%gt%>
<%lt%>head<%gt%>
<%lt%>meta http-equiv="refresh" content="1;URL=test.html"<%gt%>
<%lt%>SCRIPT LANGUAGE="Javascript"<%gt%>

  var screen_size_table = new Array(800, 600,
                                    1024, 768,
                                    1152, 864,
                                    1280, 1024);
  var window_size_table = new Array(720, 405,
                                    960, 300,
                                    1088, 300,
                                    1260, 300);

  var default_width_percent = 75;

  var default_height_percent = 75;

  var target_html_page = "home.html";

  var target_window_name = "home";


  function open_window()
    {
    var i;
    var window_width;
    var window_height;
    var window_top;
    var window_left;

    if (window.screen.availHeight)
      {
      window_height = window.screen.availHeight * (default_height_percent / 100);
      window_width = window.screen.availWidth * (default_width_percent / 100);
      }

    for (i = 0; i < screen_size_table.length; i += 2)
      if ((screen_size_table[i] == window.screen.width) &&
          (screen_size_table[i + 1] == window.screen.height))
        {
        window_width = window_size_table[i];
        window_height = window_size_table[i + 1];

        break;
        }

    if (window.screen.availHeight && (window.screen.availTop == 0))
      {
      window_top = ((window.screen.availHeight / 2) + window.screen.availTop) - (window_height / 2);
      window_left = ((window.screen.availWidth / 2) + window.screen.availLeft) - (window_width / 2);
      }
    else if (window.screen.availHeight)
      {
      window_top = (window.screen.availHeight / 2) - (window_height / 2);
      window_left = (window.screen.availWidth / 2) - (window_width / 2);
      }
    else
      {
      window_top = 0;
      window_left = 0;
      }

    window.open(target_html_page, target_window_name, "screenX=" + window_left + ",screenY=" + window_top + ",height=" + window_height + ",width=" + window_width + ",hotkeys=no,directories=no,menubar=no,location=no,personalbar=no,resizable=no,scrollbars=no,status=no,titlebar=no,toolbar=no").moveTo(window_left, window_top);
    }
//-->
<%lt%>/SCRIPT<%gt%>
<%lt%>/head<%gt%>

» Level Intermediate

Added: 2002-09-19 Rating: 7 Votes: 15 1 2 3 4 5 6 7 8 9 10 (10 being the highest) Thank you for voting! We have encountered an error. Please try again later. You've already voted.

» Author

Adam Thomas a.k.a. ad_mtk2 ad_mtk2@hotmail.com http://adland.united.net.kg

» Download

Download the files used in this tutorial.

Download (3 kb)

» Forums

More help? Search our boards for quick answers!