JS

$(".row").live("hover", 
    function() 
    { 
     $(".remove").fadeIn(); 
    } 
    ); 
$(".row").live("blur", 
    function() 
    { 
     $(".remove").fadeOut(); 
    } 
    );

HTML標記

<div class="row chapter" node="1"> 
    <img class="remove" src="design/images/remove.png"> 
    Sample 
</div> 
<div class="row chapter" node="2"> 
    <img class="remove" src="design/images/remove.png"> 
    Sample 2 
</div>

我想要做的是，使用jQuery懸停功能有問題

淡入懸停事件，與.remove一流形象（其中 內部盤旋.row div）和fa去模糊事件。
在.remove點擊，得到家長的div節點屬性

的jsfiddle

http://jsfiddle.net/tt13/3VG5P/3/

我缺少的東西？

來源

2012-02-27 Tural Ali

淡入懸停事件，帶有class .remove的圖像（它位於懸停的.row div內）並在模糊事件中淡出。

這將在懸停的行內切換類「刪除」。

$('.row').hover(function() { 
    $(this).find('.remove').stop(true, true).fadeIn(); 
}, function(){ 
    $(this).find('.remove').stop(true, true).fadeOut(); 
});

您還應該使用stop(true, true)清除動畫隊列，並結束正在進行的任何動畫。

在卸下襬臂點擊，得到家長的div節點屬性

$('.remove').click(function() { 
    var $parent = $(this).parent(); 
    var nodeValue = $parent.attr('node') || "missing-node-value"; 
    console.log("node =", nodeValue); // DEBUG 
    $parent.slideUp(); 
});

查看demo。

來源

2012-02-27 07:32:04 Stefan

http://jsfiddle.net/tt13/3VG5P/3/ – 2012-02-27 07:33:22

更新我的答案''.remove''的'click'事件。 – Stefan 2012-02-27 07:44:25

檢查語法：

 

(".remove").fadeIn(); 
//Should be 
$(".remove").fadeIn(); 

Try: 
$(this).children(".remove").fadeIn();

編輯： BLUR事件不要對資料覈實工作，所以你可以嘗試使用鼠標移開，像

 

$(".row").live("mouseout", function() { 
    $(this).children(".remove").fadeOut(); 
});

來源

2012-02-27 07:23:29

OMG ..愚蠢的錯字.. – 2012-02-27 07:24:54

但它消失在所有立即刪除。我需要一個站在裏面的div div – 2012-02-27 07:26:14

看編輯的代碼，應該可以工作 – 2012-02-27 07:28:06

$(".row").hover(function(){ 
    $(".remove", this).stop().fadeIn(); 
}, function(){ 
    $(".remove", this).stop().fadeOut(); 
});

試試這個。

來源

2012-02-27 07:32:34 littlealien

http://jsfiddle.net/tt13/3VG5P/3/ – 2012-02-27 07:34:41

這是CSS的工作，而不是jQuery。我會用這個簡單的CSS：

.row .remove { 
    opacity: 0; 
    -webkit-transition: opacity 0.5s ease; 
    -moz-transition: opacity 0.5s ease; 
    -ms-transition: opacity 0.5s ease; 
    transition: opacity 0.5s ease; 
} 
.row:hover .remove { 
    opacity: 1; 
}

演示http://jsfiddle.net/KPQ5h/

如果你仍然想的javascript：

$(".row").on({ 
    mouseover: function() { 
     $(this).find('.remove').fadeIn(); 
    }, 
    mouseout: function() { 
     $(this).find('.remove').fadeOut(); 
    } 
});

http://jsfiddle.net/KPQ5h/1/

來源

2012-02-27 07:33:32 dfsq

非常好的第一個問題的解決方案。向上。現在第二：在.remove點擊，獲得父div的節點屬性。我怎樣才能做到這一點？ – 2012-02-27 07:42:54

使用jQuery懸停功能有問題

JS

HTML標記

的jsfiddle

回答

相關問題