javascript - 显示和隐藏具有相同类的不同

Question

我有这段用 javascript 创建的 html 代码。

$(".timeline-points").prepend( "<div class='vd-cues''></div>" );

$(".vd-cues").css('left',p/d*100+"%"); //bullets position on the progress bar

$(".timeline-points").prepend("<img class='preview-img' src='./vids/out/"+f+"' height='80px'></img>");

$(".preview-img").css('left',p/d*100-7+"%");

我想要的是当鼠标悬停在特定的vd-cues 上时获取preview-img。因此，当鼠标悬停在第一个 vd-cues 上时，第一个图像应该是 show，而在第二个 vd-cues 上应该是第二个图像应该是show，等等...

我已经尝试了几种方法，但我无法让它发挥作用。我认为这是因为我正在使用 jQuery 创建 HTML，还因为我即将调用函数 OverBullets。

http://jsfiddle.net/7R36G/1/

Answer 1

id 在 HTML 文档中是唯一的。

更好的方法是使用 class 并隐藏它们

<img class="preview" src="...">
<img class="preview" src="...">

jQuery

$('img.preview').hide()