我想创建一些我的老板喜欢的东西,称之为“交互式信息图”,这几乎就像一个测验。jQuery鼠标事件 - 如何多次触发
我想知道是否有人可以告诉我如何让我的jQuery事件多次触发?我需要使用循环吗?几乎我有一个mouseenter和mouseleave事件,但他们只发射一次。
此外,我有问题,当出现勾号时,我的h2元素“下降”。
$(document).ready(function() {
$('.user-answer-a').hide();
$('.user-answer-b').hide();
// slide in from right
$('.left-side-container h2').addClass('animated slideInRight');
$('.answer-container h2').addClass('animated slideInRight');
// show tick on hover
$('.right-side-container-top').on('mouseenter', function() {
$('.user-answer-a').show();
$('.user-answer-a').addClass('animated zoomIn');
});
$('.right-side-container-top').on('mouseleave', function() {
$('.user-answer-a').show();
$('.user-answer-a').addClass('animated zoomOut');
});
$('.right-side-container-bottom').on('mouseenter', function() {
$('.user-answer-b').show();
$('.user-answer-b').addClass('animated zoomIn');
});
$('.right-side-container-bottom').on('mouseleave', function() {
$('.user-answer-b').show();
$('.user-answer-b').addClass('animated zoomOut');
});
});
看看我的codepen here
感谢一大堆!
在'mousenter'事件你有一个' function'。该功能可以完成尽可能多的代码。它可以建立一个完整的网站。它甚至可以以编程方式触发其他鼠标事件,尽管一些浏览器并不特别赞同这种技术,并且阻止它或提醒用户(你不需要这样做)。所有你需要做的就是把你想要的功能放在里面。当然,'mouseleave'也一样。 –
你没有撤销你在鼠标中的动作。反之亦然。 – Rooster
jQuery有两个选项来创建事件侦听器。 on()是一个主动侦听器,所以你可以点击它多少你想要的,它触发事件。 one()只会为一次页面加载启动一次。 –