闪光灯继续闪烁onmouseover,jquery

时间:2010-07-22 14:52:45

标签: jquery

嘿那里,我有这个代码......当我鼠标移动闪光灯时,它闪烁并重新加载,为什么?谢谢;)

$(document).ready(function(){

$("#test").mouseover(function() {
 $("#test").html('`<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,24,0" width="250" height="250"><param name="movie" value="http://static.awempire.com/flash/live_feeds/live_feed.swf" /><param name="quality" value="high" /><param name="wmode" value="transparent" /><param name="flashvars" value="appletroot=http://static.awempire.com/flash/live_feeds/&appletskin=template8/template01.swf&appletcol=900000&psid=ddany23&campaign_id=20520&pstour=t1&psprogram=REVS&site=jsm&flags=137438953473,137438953504,1,32&lp_lang=auto" /><embed src="http://static.awempire.com/flash/live_feeds/live_feed.swf" width="250" height="250" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" wmode="transparent" flashvars="appletroot=http://static.awempire.com/flash/live_feeds/&appletskin=template8/template01.swf&appletcol=900000&psid=ddany23&campaign_id=20520&pstour=t1&psprogram=REVS&site=jsm&flags=137438953473,137438953504,1,32&lp_lang=auto"></embed></object>`');
});


$("#test").mouseleave(function() {
  $("#test").html('ddd');
});

1 个答案:

答案 0 :(得分:3)

而不是在输入子元素时触发的mouseover,请使用mouseenter,如下所示:

$("#test").mouseenter(function() {
 $(this).html('<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,24,0" width="250" height="250"><param name="movie" value="http://static.awempire.com/flash/live_feeds/live_feed.swf" /><param name="quality" value="high" /><param name="wmode" value="transparent" /><param name="flashvars" value="appletroot=http://static.awempire.com/flash/live_feeds/&appletskin=template8/template01.swf&appletcol=900000&psid=ddany23&campaign_id=20520&pstour=t1&psprogram=REVS&site=jsm&flags=137438953473,137438953504,1,32&lp_lang=auto" /><embed src="http://static.awempire.com/flash/live_feeds/live_feed.swf" width="250" height="250" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" wmode="transparent" flashvars="appletroot=http://static.awempire.com/flash/live_feeds/&appletskin=template8/template01.swf&appletcol=900000&psid=ddany23&campaign_id=20520&pstour=t1&psprogram=REVS&site=jsm&flags=137438953473,137438953504,1,32&lp_lang=auto"></embed></object>');
});

来自the .mouseenter() docs

  

mouseenter事件处理事件冒泡的方式与mouseover不同。如果在此示例中使用mouseover,则当鼠标指针移过 Inner 元素时,将触发处理程序。这通常是不受欢迎的行为。另一方面,mouseenter事件仅在鼠标进入其绑定的元素而不是后代时触发其处理程序。因此,在此示例中,当鼠标进入外部元素而不是内部元素时,将触发处理程序。

你也可以使用.hover()缩小范围,如下所示:

$("#test").hover(function() {
  $(this).html('<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,24,0" width="250" height="250"><param name="movie" value="http://static.awempire.com/flash/live_feeds/live_feed.swf" /><param name="quality" value="high" /><param name="wmode" value="transparent" /><param name="flashvars" value="appletroot=http://static.awempire.com/flash/live_feeds/&appletskin=template8/template01.swf&appletcol=900000&psid=ddany23&campaign_id=20520&pstour=t1&psprogram=REVS&site=jsm&flags=137438953473,137438953504,1,32&lp_lang=auto" /><embed src="http://static.awempire.com/flash/live_feeds/live_feed.swf" width="250" height="250" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" wmode="transparent" flashvars="appletroot=http://static.awempire.com/flash/live_feeds/&appletskin=template8/template01.swf&appletcol=900000&psid=ddany23&campaign_id=20520&pstour=t1&psprogram=REVS&site=jsm&flags=137438953473,137438953504,1,32&lp_lang=auto"></embed></object>');
}, function() {
  $(this).html('ddd');
});