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 5 of 5
  1. #1
    New to the CF scene
    Join Date
    Aug 2006
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Mouse over - photo preview

    Hi all!

    I relly need a script like it's at http://www.templatemonster.com (template preview). I need to prievew my images in this type of window when somebody roll at thumbnail image.

    I tried to copy this script form themplatemonster but it's very complicatedn & little messed there. I know just a little about javascript...

    Please help me...

  • #2
    New to the CF scene
    Join Date
    Aug 2006
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    anyone helps?

  • #3
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,518
    Thanks
    3
    Thanked 506 Times in 493 Posts
    simplest
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
    
    <html>
    
    <head>
      <title></title>
    <script type="text/javascript">
    <!--
    
    var Obj;
    function ToolTip(obj,con,x,y){
     Obj=document.getElementById('Pop');
     Obj.innerHTML=con;
     Obj.style.left=(zxcPos(obj)[0]+x)+'px';
     Obj.style.top=(zxcPos(obj)[1]+y)+'px';
     Obj.style.visibility='visible';
    }
    
    function Hide(){
     Obj.style.visibility='hidden';
    }
    
    function zxcPos(zxcobj){
     zxclft=zxcobj.offsetLeft;
     zxctop=zxcobj.offsetTop;
     while(zxcobj.offsetParent!=null){
      zxcpar=zxcobj.offsetParent;
      zxclft+=zxcpar.offsetLeft;
      zxctop+=zxcpar.offsetTop;
      zxcobj=zxcpar;
     }
     return [zxclft,zxctop];
    }
    
    
    //-->
    </script>
    
    </head>
    
    <body>
    <center>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <div onmouseout="Hide();" style="width:100px;" onmouseover="ToolTip(this,'<img src=http://www.vicsjavascripts.org.uk/StdImages/One.gif width=200 height=200 >',-10,20)" >Link</div>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <img src=http://www.vicsjavascripts.org.uk/StdImages/Three.gif width=40 height=20 onmouseout="Hide();" style="width:100px;" onmouseover="ToolTip(this,'<img src=http://www.vicsjavascripts.org.uk/StdImages/Three.gif width=200 height=100 >',-10,20)" >
    </center>
    
    <div id="Pop" style="position:absolute;" ></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/

  • #4
    New to the CF scene
    Join Date
    Sep 2006
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Thanks a million

    Hi vwphillips,

    Many thanks for the script, I was searching like hell in the web for about a month for such sort of simple script for thumbnail view.

    really a great relief for me. Thank you and Thank God..

    above all Many thanks to CodingForums.com

    regards,
    Sreen

  • #5
    New to the CF scene
    Join Date
    Sep 2006
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Seeing this post led me to register straight away

    a no nonsense response from a knowledgable coder

    Great to see

    SD


  •  

    Posting Permissions

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