2015-12-21 76 views
0

我把絕對定位的DIV覆蓋在包含flash對象的頁面上。 div具有較高的z-索引並攔截點擊事件。 目的是在單擊flash對象時獲取div中的單擊。DIV over flash object

<html> 
<head> 
    $(document).ready(function() { 
     var htmlHeight = $(html).height() + 'px'; 
     var htmlWidth = $(html).width() + 'px'; 
     var fgDiv = $('body').append('<div>'); 
      fgDiv.css("position": "absolute"); 
      fgDiv.css("top", 0); 
      fgDiv.css("left", 0); 
      fgDiv.css("width", htmlWidth); 
      fgDiv.css("height", htmlHeight); 
      fgDiv.css("z-index", 99999); 
      fgDiv.on('click', function() { 
       alert("Hello, World!"); 
      }); 
    }); 
</head> 
<body> 
    <div>Hello, World!</div> 
    <div><object width="400" height="50" data="img/car.swf"></object></div> 
</body> 
</html> 

該解決方案完美地工作在MS Windows和Linux的Chrome,但不能在Windows/Linux的Firefox瀏覽器。

可能是什麼原因?

+0

Flash Player與瀏覽器不同,所以您如何看待操作系統?嘗試爲您的SWF對象使用「不透明」或「透明」的「wmode」... – akmozo

+0

原來,在Windows中的Firefox中也不起作用。所以,「問題」在Firefox中。 swf對象不是我的。 – rlib

+0

'wmode'是''的物業... – akmozo

回答

0

您可以創建該div來僅覆蓋SWF對象,而不覆蓋HTML頁面的所有內容,並且不要忘記設置SWF對象的wmode

HTML:

<div id='swf_container' style='position: relative;'> 
    <object id='swf_object' width='400' height='50' data='swf.swf' wmode='opaque'></object> 
</div> 

的JavaScript:

$(document).ready(function(){ 

    var height = $('#swf_object').height() + 'px', 
     width = $('#swf_object').width() + 'px'; 

    var div = $('<div style="position: absolute; top:0; left:0; width:'+width+'; height: '+height+'; z-index: 99999;"></div>') 
     .on('click', function(){ 
      alert('Hello, World!'); 
     }); 

    $('#swf_container').append(div); 

}); 

我沒有Linux的,現在來測試這個代碼,但它在Windows(火狐,Chrome)工作正常。

希望能有所幫助。