CODEWITHSUNDEEP
jquerymouseovermouseout
Mike
Mike

Reputation: 175

Mouseover and Mouseout function jQuery

I have this script:

$("#teaser ul.buttons li").mouseover(function()
    {
        $("a",this).animate({ left: '0' },350);
    }).mouseout(function()
    {

        $("a",this).animate({ left: '-11px' },350);
    });

But when i now hover over the a element. The mouseover and mouseout going continu. How can i change this script. That when i hover of the a element. That the mouseout launch when i hover off the element.

Upvotes: 6

Views: 33166

Answers (3)

andyb
andyb

Reputation: 43823

Is http://jsfiddle.net/BBUJ7/ what you are looking for? I changed the mouseover and mouseout to hover since you mentioned hovering in the question and added a {position:relative} CSS rule.

Upvotes: 7

Rafay
Rafay

Reputation: 31033

use mouseenter and mouseleave instead of mouseover and mouseout

Upvotes: 10

Mike
Mike

Reputation: 175

Here you have html code:

<ul class="buttons">
                    <li>
                        <h2>
                            <a class="koeriersdiensten" href="pagina.html" title="Koeriersdiensten">Koeriersdiensten
                                <span>Lorem ipsum dolor sit amet</span>
                            </a>
                        </h2>
                    </li>
                    <li>
                        <h2>
                            <a class="taxivervoer" href="pagina.html" title="Taxivervoer">Taxivervoer
                                <span>Lorem ipsum dolor sit amet</span>
                            </a>
                        </h2>
                    </li>
                </ul>

Upvotes: 1

Related Questions