Question

所以基本上我有css会导致元素在悬停时变大（增加高度）。我希望能够有一个功能，允许您单击该元素，禁用悬停功能（通过使用.css（）将高度设置回它的正常状态），触发不同的代码段，以及完成后将悬停高度设置为正常。由于.css（）没有回调功能，我对如何执行此操作感到困惑。

这里有一个jsfiddle，它给出了我想要做的事情的布局。

http://jsfiddle.net/lennox02/99KB2/3/

这里是有问题的代码行

//this fires first, disabling the hover height of 200px;
$(".single-item:hover").css({"height":"100px"});

//the code I want to fire, fires second
$("#6").html("Hello");

//after the code finishes firing, put the hover height back to how it was    
$(".single-item:hover").css({"height":"200px"});

Answer 1

试试这个，我认为它更接近你想要的http://jsfiddle.net/99KB2/6/但可能不准确。如果这还不够好，你可能需要研究JavaScript回调。

$(".single-item").on('click', function() {
    //this fires first, disabling the hover height of 200px;
    $(this).css("height", "100px");

    //the code I want to fire, fires second
    $("#6").html("Hello");
});

$(".single-item").on('mouseout', function() {
    $(this).css("height", "");
});

此外，使用所有jQuery事件而不是混合JavaScript和jQuery要容易得多。

如何使jquery CSS操作同步（即没有回调）？

1 个答案: