0

我目前在我的第一个网站上工作-但是我对这段 jquery 遇到了一个小问题...该页面是：

http://beelinetest.site50.net/the_arts_and_culture_in_worcester.html

我在我网站上已完成的页面中都有翻转效果（当您将鼠标悬停在链接上时，单词会稍微向右移动），这可以在活动计划页面上更好地看到。

但是在这个页面上，我有很多 jquery 正在进行......当点击这个词时，这个词会移到页面的左边。但是由于鼠标悬停，（在释放时将单词移回右侧）该单词会在屏幕上弹回其原始位置。

请随时查看我的代码，我真的很感激 - 我知道你们很棒，所以提前谢谢！汤姆

这是两个冲突的代码-

$("#exploretext").click(function(){ 
$(".moveeverythingleft").animate({"left":"-220px"}, 400);
return false;
});



$("#exploretext").hover(function(){ 
$("#exploretext").animate({"left":"227px"}, 50);
}, function(){
$("#exploretext").animate({"left":"217px"}, 150);
});
4

2 回答 2

1

这将在单击事件后解除悬停效果：

$("#exploretext").on("click",function() 
{ 
    $(this).off("hover", "**");
    $(".moveeverythingleft").animate({"left":"-220px"}, 400); return false; 
});

$("#exploretext").on('hover',function()
{ 
    $("#exploretext").animate({"left":"227px"}, 50); }, function()
    { 
        $("#exploretext").animate({"left":"217px"}, 150); 
    });
});

您可能需要稍后重新绑定它，或者绑定另一个，这取决于您想要实现的目标。

使用 += 使用另一个动画函数可能更容易：

$("#exploretext").animate({"left":"+=10px"}, 50, 'linear');

编辑 ：

我正在阅读您的代码，标记和 css 有点乱，我认为它使您的工作比应有的更难。

我建议您先尝试清理 HTML 和 CSS，然后处理 JS 部分。

于 2012-04-08T18:44:57.043 回答
0

你可以做的是将按钮的状态存储在一些变量中，比如..

var position = "LEFT OR RIGHT";

然后当您将按钮发送到左侧时，将变量更改为左侧。并在悬停事件中检查值，然后如果位置在左侧，则不执行整个事件，如果位置正确，则执行事件。

function OnExploreClick(){
position = 'left';
//ur code
}

function OnUnExploreClick()
{
//put the button to right side// ur code
then position = 'right';
}
function OnHover()
{
if (position == 'right')
{
//execute ur code
}
}
于 2012-04-08T18:53:54.720 回答