开发者

Hover Item with JQuery

Is there a way to hover an element using javascript? I don't want to create another class, I just want to cause element to hover with javasc开发者_如何学Pythonript when my mouse pointer is not over that element.

For example I have 5 elements with the same class and I want to call hover on all of them when one of them is actually hovered.


I assume you mean the pseudo class :hover that you've associated with a link (for example). As you hover over that link, you want to invoke all other link's :hover styles.

Unfortunately, you can not invoke the :hover styles from jQuery, that requires that you actually move your mouse pointer over that element. You have to use classes and utilize jQuery's hover event.


You can achieve this by addressing all of the items in your collection at the same time in your hover event handlers

var items = $(".some-class-applied-to-many-different-items");
items.hover(function() {
        // Mouseover state
        items.addClass("blah"); // <- for example
    },
    function() {
        // Mouseout state
        items.removeClass("blah");
});


If I understand your question correctly, you've added a hover event using jQuery, and you'd like to trigger that event manually regardless of the mouse.

If I understood correctly, you want to call the mouseenter to trigger the mouseenter event.

If I've understood incorrectly, and you actually have a :hover CSS rule which you'd like to trigger using Javascript, that's not possible.
Instead, you should add a class name to the rule (eg, something:hover, something.FakeHover { ... }), and add that class name using jQuery. (eg, $(...).addClass('FakeHover')).


In jQuery, the trigger function allows you to trigger events (includingmouseover, I believe) on elements.

In straight JavaScript, if you’ve assigned a function to an element’s event handler, you can of course call that whenever you want. E.g.

function mouseoverHandler() {
    // Do something
}

// Assign function to element’s event handler
document.getElementById('link1').onmouseover = mouseoverHandler

// Call that function
document.getElementById('link1').onmouseover();
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜