Use the overLIB library to pop up hints for words on your web page using JavaScript and PHP.
With the overLIB JavaScript library , you can have handy pop-up labels that appear above text on your page. This hack makes it a little easier to create these links by providing a PHP wrapper function to invoke the library.
Complete Code
Save the code shown as pop-up.php.
A wrapper function that simplifies overLIB use, courtesy of PHP
<?php
function popup( $text, $popup )
{
?>
<a href="javascript:void(0);" onmouseover="return overlib('<?php echo($popup); ?>
');" onmouseout="return nd();"><?php echo($text); ?></a>
<?php
}
?>
<html>
<head>
<script type="text/javascript" src="overlib/overlib.js"><!-- overLIB (c) Erik Bosrup -->
</script>
</head>
<body>
<div id="overDiv" style="position:absolute; visibility:hidden; z-index:1000;">
</div>
With PHP, we can combine with some javascript to make small popups. <br />Just hover your mouse on <?php popup(
'me', 'And this is The Hover Text.<br/>Looking Wonderfull ha?.'
); ?>. It's work ^_*.
</body>
</html>
You could also put the wrapper function into a PHP library, include that library in your PHP pages, and turn this into a nice, reusable utility function.
Test Your Code
Download and unpack the overLIB library into your web server’s documents directory. Then add in the pop-up.php file and test it on your browser, You should see something similar
Next, move the mouse over the word me, and you will see the pop up appear, which gives you a little more information about me
This pop up can be as elaborate as you like, with images, tables, different fonts, styles, and whatever else you want it.
Leave a Comment