Question

我有一个div，显示用户点击带有jQuery slideToggle的按钮的时间。一切正常，我唯一的问题是，只要显示button，我就希望将:hover保持在div状态。用户再次单击它并隐藏div后，该按钮应再次处于non-hover状态。

我该怎么做？

它的外观如下：http://jsfiddle.net/Teo123/4DW7U/1/

HTML

<div class="travel_infobox" id="infobox_1">
    <p>Text</p>
</div>

<div class="travel_info">
    <a href="#" id="info_button_1">InfoBox</a>
</div>

的jQuery

$(document).ready(function(){
    $(".travel_infobox").hide();
    $("#info_button_1").click(function(e){
        $("#infobox_1").slideToggle(600);
        e.preventDefault();
    });
});

CSS

.travel_info a{
    text-decoration : none;
    background      : url('../images/info_icon.png') no-repeat left top 0px;
    color           : #555;
    }

.travel_info a:hover{
    background      : url('../images/info_icon.png') no-repeat left bottom 0px;
    color           : #FF6C00;
    text-decoration : underline;
    }

Answer 1

你好，添加开关stat var

$(document).ready(function(){
var btn=true;
$(".travel_infobox").hide();
$("#info_button_1").click(function(e){
    $("#infobox_1").slideToggle(600);
    if(btn) {
        $('.travel_info a:hover').css('text-decoration', 'underline');
        btn=false;
    }else{
       btn=true;
         $('.travel_info a:hover').css('text-decoration', 'none');
    }
    e.preventDefault();
});

}）;

addClass（）和removeClass（）也像魅力一样工作：）

如何使用jQuery for slideToggle函数添加/删除css：hover？

1 个答案: