پی سی سیتی - کد جاوا اسکریپت - نمایش توضیح زیر لینک پس از قرار گرفتن نشانگر موس بر روی آن

توضیح با آوردن موس بر روی لینک متن شما در زیر آن ظاهر می شود :
کد HTML:
 

<!-- Start of MouseOver Text Appear JavaScript -->

<!-- Instructions: 

 1.  Copy the coding into the HEAD of your HTML document

 2.  Add the last code into the BODY of your HTML document  -->

<!-- Script supplied with CoffeeCup HTML Editor -->

<!--             www.coffeecup.com              -->

<html>

<head>

<TITLE>menu visibility</title>    

<style type="text/css"> 

.Menu {

                position: absolute;   

                width: 80%; 

        border: 1px white; 

        background-color: white; 

        layer-background-color: white;                     

                top: 100px;

                left : 10%;

                line-height : 25px;

                font-family : Arial;

        visibility: hidden;                                     

                                        } 

.Mo {

                position: absolute;                     

                text-decoration : none; 

        border: 0px white; 

        background-color: white; 

        layer-background-color: white;                     

                top: 100px;

                left: 10%;

        width: 80%;

        font-family : Arial;

                visibility: hidden;                                     

                                        } 

.hide {

                visibility: hidden;

                font-family : Arial;

                } 

</style>

<script>

        var mo_lastMenu;

        var lastMenu = "null";

        if (document.layers) {  

                visible = 'show';  hidden = 'hide';

                                                } 

        else if (document.all) {  

                visible = 'visible';  hidden = 'hidden';

        }

    

function toggle(menu) {

        if (document.layers) {

        Menu = document.layers[menu];  

        } 

        else if (document.all) {

        Menu = document.all(menu).style;  

        }        

        if (Menu.visibility == visible) {

        Menu.visibility = hidden;  

        } 

        else {    

        clean(lastMenu);

                Menu.visibility = visible;  

        }

        lastMenu = Menu;

        }

    

function clean(Menu){

        if (Menu == "null"){

                return; 

        }

        if (Menu.visibility == visible) {

        Menu.visibility = hidden;  

        } 

        }

    

function mo_toggle(menu) {

        if (document.layers) {

        Menu = document.layers[menu];  

        } 

        else if (document.all) {

        Menu = document.all(menu).style;  

        }        

        if (Menu.visibility == visible) {

        Menu.visibility = hidden;  

        } 

        else {    

                Menu.visibility = visible;  

        }

        mo_lastMenu = Menu;

        }

    

    

</script>

</head>

<body bgcolor="White">

<CENTER>

<A href="#" onclick="toggle('clickWeb');return false;" onmouseout="javascript:mo_toggle('mo_web');return false;" onmouseover="javascript:mo_toggle('mo_web');return false;" >

<B><font size="+1" color="purple" face="Arial">Put Mouse Over Here here</A></B></FONT> 

</CENTER>



<div id="mo_web" class="Mo">

<FONT SIZE="+2" COLOR="green" face="Arial"><CENTER>

This is what happens!!

</FONT></CENTER>

</div>  



<div id="clickWeb" class="Menu">

<FONT SIZE="+2" COLOR="red" face="Arial"><CENTER>

Clicking the link presents these results.

</FONT></CENTER>

</div>  

<BR>



</body>

</html>

<!-- End of MouseOver Text Appear JavaScript -->

</body>

</html>