2013-03-26 112 views
0

你好我有一個php頁面顯示10條文章,閱讀更多按鈕隱藏我需要的是當我懸停在文章框閱讀更多顯示一切正常工作罰款期望當我懸停在任何顯示瞭解更多關於第一篇文章只是不是每個文章jquery只改變一個元素

這是我的PHP代碼

$query = mysql_query("SELECT * FROM stories ORDER BY id DESC LIMIT 0,10"); 
while ($row=mysql_fetch_array($query)) 
{ 
    echo "<div class='content_story_block'> 
      <div class='content_story_block_menu'>$row[title] 
       <div id='Read_More' style='display:none;' class='content_story_block_menu_span'>Read More</div> 
      </div> 
      <div class='content_story_block_row'>$row[brief]</div> 
     </div>"; 
} 

,這是我的jQuery代碼

<script type="text/javascript"> 
    $('.content_story_block').hover(function() { 
     $('#Read_More').toggle('slow', function() { 
     // Animation complete. 
     }); 
    }); 
</script> 

我缺少什麼?

+0

使用相同的ID'Read_More'一個以上的元素實際上是無效的標記,這就是你的代碼失敗的原因。嘗試使它成爲一個班級或爲每個元素分配不同的ID。 – Octopus 2013-03-26 06:31:34

回答

1

變化Read_More從ID類:

<div style='display:none;' class='content_story_block_menu_span Read_More'> 
Read More</div> 

然後改變你的腳本:

<script type="text/javascript"> 
    $('.content_story_block').hover(function() { 
     $(this).find('div.Read_More').toggle('slow', function() { 
     // Animation complete. 
     }); 
    }); 
</script> 
+0

當我懸停在任何文章上所有閱讀更多按鈕不僅顯示本文的一個 – Zeroic 2013-03-26 06:25:03

+0

我編輯嘗試新的 – 2013-03-26 06:29:40

+0

謝謝這是救了我:) +1和良好的答案,我學到了我很想念我非常感謝 – Zeroic 2013-03-26 06:37:05

0
<script type="text/javascript"> 
    $('.content_story_block').hover(function() { 
     $(this).next('#Read_More').toggle('slow', function() { 
     // Animation complete. 
     }); 
    }); 
</script> 
+0

Sane事情作爲以前的回覆,當IAM在文章上盤旋閱讀更多按鈕顯示不僅有這篇文章 – Zeroic 2013-03-26 06:26:20

+0

嘗試編輯的代碼。 – 2013-03-26 06:29:48

0

試試這個

<script type="text/javascript"> 
$('.content_story_block').hover(function() { 

$('.content_story_block_menu_span').each(function(){ 
     $(this).toggle('slow', function() { 
    // Animation complete. 
    }); 
    }) 
}); 

+0

你需要使用.each()來處理匹配類別 – alwaysLearn 2013-03-26 06:19:23

+0

的每個元素,當我懸停在文章上所有閱讀更多的按鈕顯示不只一個我不知道爲什麼所有的代碼做出相同的結果 – Zeroic 2013-03-26 06:28:26