Jquery鼠标悬停到鼠标单击

Question

我有jquery代码用于带选项卡导航的图像幻灯片放映。它正在工作&在导航的鼠标悬停器上滑动图像。我希望它能在点击特定的导航&显示其图像

工作演示-www.myevio.com

<script type='text/javascript'>//<![CDATA[ 
        $(window).load(function () {
            $(function () {
                $('.fadein img:gt(0)').hide();
                setInterval(function () {
                    $('.fadein :first-child').fadeOut().next('img').fadeIn().end().appendTo('.fadein');
                }, 5000);
                $('.banner-links-inner a').on({
                    'mouseenter': function () {
                        $('.fadein img').hide();
                        $('#' + $(this).data('id')).fadeIn();
                    }
                });
            });
        });//]]>  
    </script>

如何使其在单击而不是悬停时工作？

Answer 1

尝试过这个吗？

 $('.banner-links-inner a').click(function () {
                        $('.fadein img').hide();
                        $('#' + $(this).data('id')).fadeIn();
                    });

而是使用on？

或者如果你想在更改时使用：

$('.banner-links-inner a').on({
                    'click': function () {
                        $('.fadein img').hide();
                        $('#' + $(this).data('id')).fadeIn();
                    }
                });

Answer 2

将此'mouseenter'更改为此'click'

Answer 3

只需更换即可实现

"mouseenter"：函数（）｛

带有

"点击"：函数（）｛

并删除href表单锚标签

<a  data-id="img1">POWEROCK 13600mAh Power Bank</a>