Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Sep 2007
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    how to do something like that?

    Hi!
    There is a nice feature that I've seen on data recovery services site.
    When you move mouse over the "Country", in the top on the right side of the page, then the frame pop ups,
    with he list of country to choose. I want o do sth like that on my page, but I've just started to learn javascript,
    and I have no idea how to do it...can enybody help me out?
    Here is a link to that site where I've seen these feature: www.salvagedata.com
    Thank for your help.

  • #2
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,521
    Thanks
    3
    Thanked 507 Times in 494 Posts
    Code:
    <!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" xml:lang="en" lang="en">
    
    <head>
      <title></title>
    <style type="text/css">
    /*<![CDATA[*/
    .topicbg {
     position:relative;z-Index:101;width:100px;height:25px;background-Color:#FFFFFF;
    }
    
    .topic {
     position:relative;z-Index:1;width:100px;height:20px;background-Color:#FFFFCC;border:solid black 1px;
    }
    
    .tooltip {
      position:absolute;visibility:hidden;left:0px;top:22px;width:200px;height:200px;background-Color:#FFFFCC;border:solid black 1px;
    }
    /*]]>*/
    </style>
    <script language="JavaScript" type="text/javascript">
    /*<![CDATA[*/
    
    function zxcToolTip(zxcevt,zxcobj){
     var zxctt=zxcobj.getElementsByTagName('DIV')[0];
     if (zxcevt.type=='mouseover') zxctt.style.visibility='visible';
     else if (zxcCkEventObj(zxcevt,zxcobj))  zxctt.style.visibility='hidden';
    
    }
    
    function zxcCkEventObj(zxce,zxcobj){
     if (!zxce) var zxce=window.event;
     zxce.cancelBubble=true;
     if (zxce.stopPropagation) zxce.stopPropagation();
     var zxceobj=(zxce.relatedTarget)?zxce.relatedTarget:(zxce.type=='mouseout')?zxce.toElement:zxce.fromElement;
     while (zxceobj.parentNode){
      if (zxceobj.className&&zxceobj.className.match('zxc')){ return false; }
      zxceobj=zxceobj.parentNode;
     }
     return true;
    }
    
    /*]]>*/
    </script></head>
    
    <body>
    <div class="topicbg zxctt" >
    <div class="topic zxctt"
    onmouseover="zxcToolTip(event,this);"
    onmouseout="zxcToolTip(event,this);"
    >
     <div  class="tooltip"  >
      <a href="http://www.vicsjavascripts.org.uk" >Link</a>
     </div>
    Country
    </div>
    </div>
    
    </body>
    
    </html>
    or google Tool Tip
    Vic

    God Loves You and will never love you less.

    http://www.vicsjavascripts.org/Home.htm

    If my post has been useful please donate to http://www.operationsmile.org.uk/


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •