修改鼠标悬停脚本上的jquery缩放

Question

我在悬停脚本http://www.jacklmoore.com/zoom/

上使用此缩放功能

我正在尝试将其实现为一个图库类型的页面，但悬停功能似乎只适用于第一个图像

<span class='zoom' id='ex1'>
<img src='http://i.imgur.com/y2qMsNn.jpg' width='555' height='320' alt='Daisy on the Ohoopee'/>
<p>Hover</p>
</span>
<span class='zoom' id='ex1'>
<img src='http://i.imgur.com/y2qMsNn.jpg' width='555' height='320' alt='Daisy on the Ohoopee'/>
<p>Hover</p>
</span>
<span class='zoom' id='ex1'>
<img src='http://i.imgur.com/y2qMsNn.jpg' width='555' height='320' alt='Daisy on the Ohoopee'/>
<p>Hover</p>
</span>    

下面是我的情况演示http://jsfiddle.net/drhbt/

如何让脚本为每个图像提供缩放功能？

感谢您的帮助！

Answer 1

我无法做更好的测试，但我将id更改为了一个类并且它有效。

$('.zoom').zoom();