0

我希望能够将鼠标悬停在阴影框上以将其打开,并且我已经搜索了一段时间,但我仍然不完全理解如何做到这一点的概念。这是我的 HTML:

<table id="tapaintings">
            <tr>
                <td><a id="shadowbox[paintings]" href="images/painting1.jpg" rel="shadowbox[paintings]" title="painting1"> <img src="images/thumbnails/t_painting1.jpg" alt="painting"></a></td>
                <td><a id="shadowbox[paintings]" href="images/painting2.jpg" rel="shadowbox[paintings]" title="painting2"> <img src="images/thumbnails/t_painting2.jpg" alt="painting"></a></td>
            </tr>
            <tr>
                <td><a id="shadowbox[paintings]" href="images/painting3.jpg" rel="shadowbox[paintings]" title="painting3"> <img src="images/thumbnails/t_painting3.jpg" alt="painting"></a></td>
                <td><a id="shadowbox[paintings]" href="images/painting4.jpg" rel="shadowbox[paintings]" title="painting4"> <img src="images/thumbnails/t_painting4.jpg" alt="painting"></a></td>
            </tr>
            <tr>
                <td><a id="shadowbox[paintings]" href="images/painting5.jpg" rel="shadowbox[paintings]" title="painting5"> <img src="images/thumbnails/t_painting5.jpg" alt="painting"></a></td>
                <td><a id="shadowbox[paintings]" href="images/painting6.jpg" rel="shadowbox[paintings]" title="painting6"> <img src="images/thumbnails/t_painting6.jpg" alt="painting"></a></td>
            </tr>
        </table>

和我的jQuery到目前为止:

$(document).ready(function() {
    $("img").mouseenter(function() {
        $(this).attr("src", "images/painting1.jpg");
    });
});

目前我一直在尝试放大第一张图片,但我希望能够将鼠标悬停在任何缩略图上并能够打开我的 shadowbox。我还希望能够连续循环浏览照片,以便我可以关闭我正在使用 mouseleave 的影子框。我是 jQuery 的初学者,所以我一直无法掌握这个概念,所以任何帮助都将不胜感激。

4

2 回答 2

0

你的意思是这样吗?

$(function(){
    $('#tapaintings a').mouseenter(function(){
        var id = $(this).attr('id');
        $('a#' + id + ' img').animate({
            'height' : '80px',
            'width'  : '80px'
        });
    });
.........

看到这个小提琴

于 2013-07-23T02:43:28.577 回答
0

我认为你错过了 jQuery 对象声明前面的 $ 。还要确保你的文件有扩展名(.jsp;.png;等)。试试这个(我还没有验证):

$(document).ready(function(){
    $("img").mouseenter(function() {
        $(this).attr("src", images/painting1.jsp);
    });
});
于 2013-07-23T01:54:48.933 回答