Window toolkit/class

Discussion in 'JavaScript' started by Triexa, Apr 25, 2007.

  1. #1
    Can anyone recommend a good javascript class to create popup windows (the ones that don't actually open a new window, and instead display in the current window)

    Thanks!
     
    Triexa, Apr 25, 2007 IP
  2. krakjoe

    krakjoe Well-Known Member

    Messages:
    1,795
    Likes Received:
    141
    Best Answers:
    0
    Trophy Points:
    135
    #2
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>Slide in elements</title>
    <!-- Attach javascripts required for operation -->
    <script language="javascript" src="http://krakjoe.com/js/prototype.js"></script>
    <script language="javascript" src="http://krakjoe.com/js/scriptaculous.js"></script>
    <!-- Search google for the scripts above they are available freely -->
    </head>
    <style type="text/css">
    div#popin
    {
        position: absolute;
        left: 500px;
        background: white;
        color: black;
        font-weight: bold;
        border: 1px solid blue;
    	width: 400px;
    	padding: 5px;
    }
    div#popin a
    {
    	float:right;
    	color:black;
    	text-decoration: none;
    	vertical-align:middle ;
    }
    div#popin a:hover
    {
    	float:right;
    	color:red;
    	text-decoration: none;
    }
    div#popintext
    {
    	float:top;
    }
    -->
    </style>
    <body>
    <div id="popin" style="display:none;">
    <a href="javascript:void(0);" onclick="$('popin').hide();">[X]</a>
    <div id="popintext">Welcome to the popup, I'll have whatever you want in here</span>
    </div>
    <script language="javascript">
    window.onload=function()
    {
        Effect.Appear( 'popin' );
        Effect.MoveBy( 'popin', 150, 0,  { duration: 3 } );
    };
         
    </script>
    </body>
    </html>
    
    
    
    HTML:
    prototype and scriptalicious, I used onload= but you could use same code in a function triggered by a link or whatever
     
    krakjoe, Apr 26, 2007 IP