Question

我正在尝试练习jQuery事件，我希望在点击事件时点击一些图片，只是为了处理多种效果。

目前，我的图像在悬停时会增长，然后在mousedout时缩小一切正常，直到我取消注释jQuery中的注释代码。图像消失了。我已经尝试了一切我能想到的东西，而且我不确定我哪里出错了我是jQuery的新手，我通过其他项目的教程和源代码自学，所以我不会怀疑这对我来说是不是很愚蠢。
如果有人能帮助我解决我的问题，我将不胜感激。到目前为止，bug修复似乎是我编码中最薄弱的部分。

    $(document).ready(function() {
        var preloadImgs = ['imgs/ptilota.jpg',
                           'imgs/cell_division.jpg',
                           'imgs/lynx_spiders.jpg'];

        var imgs = [];
        for (var i=0; i<preloadImgs.length; i++) {
            imgs[i] = new Image();
            imgs[i].src = preloadImgs[i];
        }

        var photo = $('#photo');
        var imgVal = 0;

        photo.attr('src',preloadImgs[imgVal]);

        photo.hover(
            function() {
                $(this).stop().animate(
                    {
                        width: '1080px',
                        height: '682px'
                    }, 500
                );
            },

            function() {
                $(this).stop().animate(
                    {
                        width: '540px',
                        height: '341px'
                    }, 500
                );
            }
        );

        /* photo.click(

            function() {
                imgVal = imgVal + 1;

                 if (imgVal >= preloadImgs.length) {
                    imgVal = 0;
                } 

                photo.attr('src',preloadImgs[imgVal]);
            }
        ); */

    });

这是HTML：

<body>

<img src="" id="photo" />

</body>

尝试向图像添加单击功能，使图像消失

0 个答案: