Looking for script!

**frog** · 01-04-2009, 07:27 PM

Hello there, can some1 help me, i am looking this what is on this web:

http://salonplus.ee/index.php/page_id/41

There is slide content where are pictures and if mouse over then comes info anf if you move mouse over left or righ side arrow then pictres are moving

Hope you all understand me

And thank you very much if any1 can help me

Best Regards,
FroG

**Nile** · 01-04-2009, 08:32 PM

Will one of the following work?
http://dynamicdrive.com/dynamicindex...iongallery.htm
http://www.dynamicdrive.com/dynamici...epcarousel.htm

**Snookerman** · 01-04-2009, 08:37 PM

If you are referring to the tooltip, that can be done in a few ways. Check out these tutorials to learn how to do it with jQuery:
http://blog.themeforest.net/tutorials/jquery-for-absolute-beginners-day-11/ and Demo
http://blog.themeforest.net/tutorials/jquery-for-absolute-beginners-day-12/ and Demo

You can also take a look at these simpler ones on DD:
http://www.dynamicdrive.com/dynamicindex5/dhtmltooltip.htm
http://www.dynamicdrive.com/dynamicindex5/dhtmltooltip2.htm

Good luck!

**Nile** · 01-04-2009, 08:39 PM

I believe he was talking about when you hover over the arrows under "Selle tootega sobivad"

**frog** · 01-04-2009, 08:48 PM

Originally Posted by Nile

I believe he was talking about when you hover over the arrows under "Selle tootega sobivad"

hi. I mean the whole thing what there is...under"Selle tootega sobivad" the whole script.

similar like this:http://dynamicdrive.com/dynamicindex...iongallery.htm
but i want if i slide mouse over then it shown info like this are Under "Selle tootega sobivad"
http://salonplus.ee/index.php/page_id/41

**Nile** · 01-04-2009, 08:49 PM

Well - my script should cover the scrolling. And Snookerman's should cover the tooltip.

**frog** · 01-04-2009, 08:59 PM

Originally Posted by Nile

Well - my script should cover the scrolling. And Snookerman's should cover the tooltip.

But like this whole script dont exist?

**Nile** · 01-04-2009, 09:03 PM

Not that I know of... If you need help combining them just ask though.

**frog** · 01-04-2009, 09:14 PM

Originally Posted by Nile

Not that I know of... If you need help combining them just ask though.

it would be very useful if you can make tutorial to combining them or just help me

**Snookerman** · 01-04-2009, 09:31 PM

Here you go:

HTML Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta name="generator" content="HTML Tidy, see www.w3.org">
        <meta http-equiv="Content-Type" content= "text/html; charset=iso-8859-1">
        <title>Untitled Document</title>
        <link rel="stylesheet" type="text/css" href= "http://dynamicdrive.com/dynamicindex4/gallerystyle.css">
        <!-- Do not edit IE conditional style below -->
        <!--[if gte IE 5.5]>
            <style type="text/css">
            #motioncontainer {
            width:expression(Math.min(this.offsetWidth, maxwidth)+'px');
            }
            </style>
        <![endif]--><!-- End Conditional Style -->
        <script type="text/javascript" src= "http://dynamicdrive.com/dynamicindex4/motiongallery.js">
            
            /***********************************************
             * CMotion Image Gallery- &copy; Dynamic Drive DHTML code library (www.dynamicdrive.com)
             * Visit http://www.dynamicDrive.com for hundreds of DHTML scripts
             * This notice must stay intact for legal use
             * Modified by Jscheuer1 for autowidth and optional starting positions
             ***********************************************/
        </script>
        <style type="text/css">
            #dhtmltooltip {
                position: absolute;
                width: 150px;
                border: 2px solid black;
                padding: 2px;
                background-color: lightyellow;
                visibility: hidden;
                z-index: 100;
            }
        </style>
    </head>
    <body>
        <div id="motioncontainer" style="position:relative;overflow:hidden;">
            <div id="motiongallery" style="position:absolute;left:0;top:0;white-space: nowrap;">
                <nobr id="trueContainer">
                    <a href= "javascript:enlargeimage('http://dynamicdrive.com/dynamicindex4/dynamicbook1.gif')"><img onMouseover="ddrivetip('JavaScriptKit.com JavaScript tutorials','yellow', 300)" onMouseout="hideddrivetip()" alt="" src= "http://dynamicdrive.com/dynamicindex4/dynamicbook1.gif" border="1"></a><a href= "javascript:enlargeimage('http://dynamicdrive.com/dynamicindex4/dynamicbook1.gif', 300, 300)"><img onMouseover="ddrivetip('JavaScriptKit.com JavaScript tutorials','yellow', 300)" onMouseout="hideddrivetip()" alt="" src= "http://dynamicdrive.com/dynamicindex4/dynamicbook1.gif" border="1"></a><a href= "http://www.dynamicdrive.com"><img onMouseover="ddrivetip('JavaScriptKit.com JavaScript tutorials','yellow', 300)" onMouseout="hideddrivetip()" alt="" src= "http://dynamicdrive.com/dynamicindex4/dynamicbook1.gif" border="1"></a><a href="#"><img onMouseover="ddrivetip('JavaScriptKit.com JavaScript tutorials','yellow', 300)" onMouseout="hideddrivetip()" alt="" src= "http://dynamicdrive.com/dynamicindex4/dynamicbook1.gif" border="1"></a><a href="#"><img onMouseover="ddrivetip('JavaScriptKit.com JavaScript tutorials','yellow', 300)" onMouseout="hideddrivetip()" alt="" src= "http://dynamicdrive.com/dynamicindex4/dynamicbook1.gif" border="1"></a><a href="#"><img onMouseover="ddrivetip('JavaScriptKit.com JavaScript tutorials','yellow', 300)" onMouseout="hideddrivetip()" alt="" src= "http://dynamicdrive.com/dynamicindex4/dynamicbook1.gif" border="1"></a><a href="#"><img onMouseover="ddrivetip('JavaScriptKit.com JavaScript tutorials','yellow', 300)" onMouseout="hideddrivetip()" alt="" src= "http://dynamicdrive.com/dynamicindex4/dynamicbook1.gif" border="1"></a><a href="#"><img onMouseover="ddrivetip('JavaScriptKit.com JavaScript tutorials','yellow', 300)" onMouseout="hideddrivetip()" alt="" src= "http://dynamicdrive.com/dynamicindex4/dynamicbook1.gif" border="1"></a><a href="#"><img onMouseover="ddrivetip('JavaScriptKit.com JavaScript tutorials','yellow', 300)" onMouseout="hideddrivetip()" alt="" src= "http://dynamicdrive.com/dynamicindex4/dynamicbook1.gif" border="1"></a>
                </nobr>
            </div>
        </div>
        <div id="dhtmltooltip">
        </div>
        <script type="text/javascript">
            
            /***********************************************
             * Cool DHTML tooltip script- &copy; Dynamic Drive DHTML code library (www.dynamicdrive.com)
             * This notice MUST stay intact for legal use
             * Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
             ***********************************************/
            var offsetxpoint = -60 //Customize x offset of tooltip
            var offsetypoint = 20 //Customize y offset of tooltip
            var ie = document.all
            var ns6 = document.getElementById && !document.all
            var enabletip = false
            if (ie || ns6) 
                var tipobj = document.all ? document.all["dhtmltooltip"] : document.getElementById ? document.getElementById("dhtmltooltip") : ""
            
            function ietruebody(){
                return (document.compatMode && document.compatMode != "BackCompat") ? document.documentElement : document.body
            }
            
            function ddrivetip(thetext, thecolor, thewidth){
                if (ns6 || ie) {
                    if (typeof thewidth != "undefined") 
                        tipobj.style.width = thewidth + "px"
                    if (typeof thecolor != "undefined" && thecolor != "") 
                        tipobj.style.backgroundColor = thecolor
                    tipobj.innerHTML = thetext
                    enabletip = true
                    return false
                }
            }
            
            function positiontip(e){
                if (enabletip) {
                    var curX = (ns6) ? e.pageX : event.clientX + ietruebody().scrollLeft;
                    var curY = (ns6) ? e.pageY : event.clientY + ietruebody().scrollTop;
                    //Find out how close the mouse is to the corner of the window
                    var rightedge = ie && !window.opera ? ietruebody().clientWidth - event.clientX - offsetxpoint : window.innerWidth - e.clientX - offsetxpoint - 20
                    var bottomedge = ie && !window.opera ? ietruebody().clientHeight - event.clientY - offsetypoint : window.innerHeight - e.clientY - offsetypoint - 20
                    
                    var leftedge = (offsetxpoint < 0) ? offsetxpoint * (-1) : -1000
                    
                    //if the horizontal distance isn't enough to accomodate the width of the context menu
                    if (rightedge < tipobj.offsetWidth) 
                        //move the horizontal position of the menu to the left by it's width
                        tipobj.style.left = ie ? ietruebody().scrollLeft + event.clientX - tipobj.offsetWidth + "px" : window.pageXOffset + e.clientX - tipobj.offsetWidth + "px"
                    else 
                        if (curX < leftedge) 
                            tipobj.style.left = "5px"
                        else 
                            //position the horizontal position of the menu where the mouse is positioned
                            tipobj.style.left = curX + offsetxpoint + "px"
                    
                    //same concept with the vertical position
                    if (bottomedge < tipobj.offsetHeight) 
                        tipobj.style.top = ie ? ietruebody().scrollTop + event.clientY - tipobj.offsetHeight - offsetypoint + "px" : window.pageYOffset + e.clientY - tipobj.offsetHeight - offsetypoint + "px"
                    else 
                        tipobj.style.top = curY + offsetypoint + "px"
                    tipobj.style.visibility = "visible"
                }
            }
            
            function hideddrivetip(){
                if (ns6 || ie) {
                    enabletip = false
                    tipobj.style.visibility = "hidden"
                    tipobj.style.left = "-1000px"
                    tipobj.style.backgroundColor = ''
                    tipobj.style.width = ''
                }
            }
            
            document.onmousemove = positiontip
        </script>
    </body>
</html>