Code Snippets

  

JavaScript Source Code


Welcome to Dream.In.Code
Getting Help is Easy!

Join 131,099 Programmers for FREE! Get instant access to thousands of experts, tutorials, code snippets, and more! There are 2,135 people online right now. Registration is fast and FREE... Join Now!





Pop-up window over Link

This is a pop-up window over a link or word(s)

Submitted By: zakary
Actions:
Rating:
Views: 5,624

Language: JavaScript

Last Modified: May 13, 2005
Instructions: style in
and in body to call style and display pop-up info

Snippet


  1. <html>
  2. <head>
  3.      <title>Pop Up</title>
  4.  
  5.      <style type="text/css">
  6.      #popupBox{
  7.           position: absolute;
  8.           top: 35px;
  9.           left: 10px;
  10.           border: solid 1px #000000;
  11.           background-color: #FFFF99;
  12.           visibility: hidden;
  13.           }
  14.      </style>
  15.  
  16.      <script language="JavaScript">
  17.      function show_it(){
  18.      document.all.popupBox.style.visibility = "visible";
  19.      }
  20.  
  21.      function hide_it(){
  22.      document.all.popupBox.style.visibility = "hidden";
  23.      }
  24.      </script>
  25. </head>
  26.  
  27. <body>
  28. <a href="javascript://" onMouseOver="show_it()" onMouseOut="hide_it()">Link for pop-up here</a>
  29.  
  30. <div id="popupBox">
  31. <p>This is the info you want displayed in the pop-up window</p>
  32. <p>This is the next line of the pop-up</p>
  33. </div>
  34.  
  35. </body>
  36. </html>

Copy & Paste


Comments


There are currently no comments for this snippet. Be the first to comment!

Add comment


You must be registered and logged on to </dream.in.code> to leave comments.





Live Help!

Tutorials

Programming

Web Development

Reference Sheets

Code Snippets

Bye Bye Ads

Free DIC T-Shirt

T-Shirt Example

Related Sites

Monthly Drawing

Thumb Drive

Partners

Top Contributors

Top 10 Kudos This Month