Question

我有这种动画按钮，点击打开菜单，是否可以将鼠标悬停在按钮上以打开它，而不是单击？

我不确定它是否使用css或javascript，但是fiddle link带有我想要鼠标悬停的按钮。

提前致谢！

的Javascript

    jQuery(document).ready(function($) {

    var colors = '';
    var server_url = ''; 
    var folder_url = 'colors/'; 

    // Style switcher
    $(".hide-color").show(1000);
    $('#custumize-style').animate({
        left: '-134px'
    });

    $('#custumize-style .switcher').click(function(e) {
        e.preventDefault();
        var div = $('#custumize-style');
        if (div.css('left') === '-134px') {
            $('#custumize-style').animate({
                left: '0px'
            });

            // open switcher and add class open
            $(this).addClass('open');
            $(this).removeClass('closed');

        } else {
            $('#custumize-style').animate({
                left: '-134px'
            });

            // close switcher and add closed
            $(this).addClass('closed');
            $(this).removeClass('open');
        }
    })
});

Answer 1

您正在寻找.hover（）

将.switcher类放在选择器中会给你带来一些奇怪的行为，因为你会在你的div内部标记你的孩子。删除该类会在父div（菜单滑块）上触发悬停方法。

这样的JavaScript第13行会产生上述行为：

$('#custumize-style .switcher').hover(function(e) {

尝试这样的事情：

$('#custumize-style').hover(function(e) {

如何鼠标悬停此按钮以打开菜单而不是单击

1 个答案: