2

我什至可能没有正确使用“事件”这个词。这是我想要做的:

我有一个以“阅读更多”字样开头的链接。当用户将鼠标悬停在“Ream More”链接上单击它时,我希望右侧的填充扩展一点,然后在悬停停止时收缩。我可以很容易地做到这一点:

$('#post-text a.more-link').hover(
function(){$(this).animate({paddingRight: '18px'}, 200);},        
function(){$(this).animate({paddingRight: '4px'}, 200);});

但是当您将鼠标悬停在它上面时,我也想附加文本“,请”。我可以使用它来做到这一点,.append()但我遇到了障碍。如果我将它添加到这样的代码中:

$('#post-text a.more-link').hover(
function(){$(this).animate({paddingRight: '18px'}, 200), $(this).append(", Please");},        
function(){$(this).animate({paddingRight: '4px'}, 200);});

然后每次有人悬停它都会添加另一个“,请”。如果可能,我只想在第一次悬停时添加一次。

此外,我希望“,请”在它们停止悬停时留在那里并且不要离开。我猜我将需要使用.one(),或者.bind()但我不确定应该去哪里。

任何帮助将不胜感激。提前致谢。

更新:我取得了一些进展,见下文:

首先,我刚刚学会了如何最终使用用户.one(),而且我也刚刚了解到它.hover()的工作方式与mouseenter. 所以这就是我现在所拥有的:

$('#post-text a.more-link').one('mouseenter', function() {
$(this).append(", Please");});

所以我对此很满意,我只需要弄清楚如何添加它和填充动画以获得更多耀斑。

4

1 回答 1

1
use $(this).append(' <span class="whatever">Please</span>');});

and on mouseout $(this).remove('.whatever');

而是使用:

$(document).ready(function(){


    $("#sall").live("mouseover mouseout", function(event) {
      if ( event.type == "mouseover" ) {
        $(this).append('Please');
      } else { 
          var g = $(this).html();
         $(this).html(g.substr(0,g.length-"Please".length)); //get rid of please
      }
});

})

看到这个例子http://jsfiddle.net/jECW5/

于 2011-07-28T17:43:08.510 回答