天天看點

解決flash和浏覽器滾軸同時被監聽問題。

把flash放在html頁面上後, 在flash上面使用滑鼠滾輪功能, 有時浏覽器的滾動條也會跟着一起滾動。

可以在滑鼠經過flash舞台時使用JS函數禁用浏覽器的滾動事件,當滑鼠移出舞台時再恢複。

html代碼:

<html>

<head>

<title>自定義滑鼠滾輪的處理函數</title>

<mce:script type="text/javascript"><!--

var OsObject = function ()

{

var ua = navigator.userAgent.toLowerCase();

var isOpera = ua.indexOf("opera") > -1,

isIE = !isOpera && ua.indexOf("msie") > -1,

isIE7 = !isOpera && ua.indexOf("msie 7") > -1;

return {

isIE : isIE,

isIE6 : isIE && !isIE7,

isIE7 : isIE7,

isFirefox : ua.indexOf("firefox")>0,

isSafari : ua.indexOf("safari")>0,

isCamino : ua.indexOf("camino")>0,

isGecko : ua.indexOf("gecko/")>0

};

}();

function disWheel(evt)

{

if(!evt) evt=window.event;

var delta=0;

if(OsObject.isFirefox)

{

delta = -evt.detail/2;

//alert(delta); // 可以調用Flash接口,讓flash響應滾輪

if(evt.preventDefault)

evt.preventDefault();

evt.returnValue = false;

}

else if(OsObject.isIE)

{

delta = evt.wheelDelta/60;

//alert(delta); // 可以調用Flash接口,讓flash響應滾輪

return false;

}

}

EnableWheelScroll = function (enable)

{

if(enable)

{

if(OsObject.isFirefox)

{

window.removeEventListener('DOMMouseScroll', disWheel, false);

}

else if(OsObject.isIE)

{

window.onmousewheel = document.onmousewheel = function(){return true};

}

}

else // disable

{

if(OsObject.isFirefox)

{

window.addEventListener('DOMMouseScroll', disWheel, false);

}

else if(OsObject.isIE)

{

window.onmousewheel = document.onmousewheel = disWheel;

}

}

}

// --></mce:script>

</head>

<body>

<p>123<p>123<p>

<a href="#" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" mce_href="#" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" onClick="EnableWheelScroll(true);">enable</a> <p>

<a href="#" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" mce_href="#" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" onClick="EnableWheelScroll(false);">disable</a> <p>

<div id="space" style="height:800;"></div>

</body>

</html>

as3代碼:

public function onMouseOver(evt:MouseEvent): void

{

ExternalInterface.call("EnableWheelScroll", false);

}

public function onMouseOut(evt:MouseEvent): void

{

ExternalInterface.call("EnableWheelScroll", true);

}

不過,這樣也是有缺陷的,當flash設定為透明(wmode="transparent"),且flash全屏播放時,這裡自定義的滾動函數很可能會不響應。這時需要在舞台上注冊MouseEvent.MOUSE_WHEEL事件處理函數。

    如果flash不需要透明屬性,則可以直接在舞台上注冊MouseEvent.MOUSE_WHEEL事件處理函數,然後使用js禁用浏覽器的滾動條即可。