2015-12-01 27 views
0

我在wordpress上發了一個博客,並且必須發佈一個動態帖子。我做了這個顯示/隱藏javascript只有一個項目

<div class="box"> 
    <span class="hide">Hide</span> 
<span class="share" style="display:none">Show</span> 
</div> 
<div class="box"> 
    <span class="hide">Hide</span> 
<span class="share" style="display:none">Show</span> 
</div> 
<div class="box"> 
    <span class="hide">Hide</span> 
<span class="share" style="display:none">Show</span> 
</div> 
<div class="box"> 
    <span class="hide">Hide</span> 
<span class="share" style="display:none">Show</span> 
</div> 
<div class="box"> 
    <span class="hide">Hide</span> 
<span class="share" style="display:none">Show</span> 
</div> 
<div class="box"> 
    <span class="hide">Hide</span> 
<span class="share" style="display:none">Show</span> 
</div> 

<scritp> 
$(".box").hover(

    function() { 
     $(".hide").hide(); 
     $(".share").show(); 
}, function() { 
     $(".hide").show(); 
     $(".share").hide(); 
}); 

</script> 
.hide, .share { 
    display:block; 
    background-color: #A85BA5; 
    padding: 30px; 
    margin-bottom: 30px; 
    color: #fff; 
    text-align: center; 
} 

這是一個notworking例如http://jsfiddle.net/s59bu5xn/8/,我想只有一個項目改變隱藏顯示。不是全部在主頁上的所有項目這個博客。

最好的問候, 中號

+0

? –

+0

只對一個項目不是當我將鼠標懸停在項目的所有變化懸停, –

回答

1

嘗試這樣

$(".box").hover(

    function() { 
     $(this).find(".hide").hide(); 
     $(this).find(".share").show(); 
}, function() { 
     $(this).find(".hide").show(); 
     $(this).find(".share").hide(); 
}); 

JSFIDDLE

你想隱藏顯示哪一個