將格在Flash對象與userscript

我已經增加了一個div來包含全屏Flash對象的頁面時，這樣的腳本：將格在Flash對象與userscript

var myDiv= document.createElement("div"); 
myDiv.style.background = "red"; 
myDiv.style.width = "30px"; 
myDiv.style.height = "30px"; 
myDiv.style.position = "absolute"; 
myDiv.style.top = "0"; 
myDiv.style.left = "0"; 
document.body.appendChild(myDiv);

在Firefox（上Greasemonkey的運行），myDiv出現在Flash對象的頂部。在Chrome中（運行在Tampermonkey上），它被添加到下面。我似乎無法通過設置z-index來改變它 - 它被忽略。

// code which apparently does nothing: 
myDiv.style.zIndex = "999"; 
var swf_div = document.getElementById("swf_div"); 
if (swf_div) { 
    swf_div.style.zIndex = "-999"; 
}

有什麼辦法，我可以得到myDiv出現在Chrome中的Flash對象的頂部，考慮到我沒有自己的主頁，並且不能設置Flash對象的Wmode PARAM？爲什麼在FF和Chrome中表現不同？

ETA主頁（glitch.com/game）來源摘要：

<body> 
    ... 
    <div id="client_div" style="width: 1680px; left: 0pt;"> 
     <object id="swf_div" width="100%" height="100%" type="application/x-shockwave-flash" data="http://c1.glitch.bz/swf/Boot_78793.swf" style="visibility: visible;"> 
      <param name="allowscriptaccess" value="always"> 
      <param name="allownetworking" value="all"> 
      <param name="wmode" value="direct"> 
      <param name="flashvars" value="--- auth tokens, omitted ---"> 
     </object> 
    </div> 
    ... 
</body>

來源

2012-01-14 tuff

鏈接到有問題的頁面。 ...也嘗試改變節點的順序。將'document.body.appendChild（myDiv）;'替換爲： 'var targ = document.querySelector（「body *」）;/*第一個孩子*/ targ.parentNode.insertBefore（myDiv，targ）;' – 2012-01-16 02:20:48

該網頁是www.glitch.com/game，但它不會運行，除非您是已登錄的播放器。我在上面的文章中添加了一些源代碼，這是我在Firebug中檢查Flash對象時看到的。嘗試了您的建議 - myDiv不會顯示在我的目標頁面上，也不會顯示在沒有Flash內容的其他頁面上。 – tuff 2012-01-16 18:53:24

我想通了，所以我會盡力回答我的問題...

首先很重要的一點：userscripts可以設置在運行Flash對象的PARAMS - 我一直認爲，導致Sam在this question中的評論是不可能的。

第二個重點：出於性能原因（source1,source2），應使用wmode值「opaque」而不是「transparent」。兩者都允許在Flash對象上繪製HTML內容。因此，我的解決方案是偵聽Flash對象何時添加到頁面（或者我認爲如果您針對的是未動態添加的Flash對象，則可以直接獲取它們），找到它們的wmode參數一個我想改變，克隆它，並與我的克隆來替換原來的PARAM：

// code to create and style myDiv, see original question 

document.addEventListener("DOMNodeInserted", nodeInserted, false); 

function nodeInserted(e) { 
    if (e.target.id == "swf_div") { 

     var found = false; 

     var params = e.target.getElementsByTagName("param"); 
     for (var i = 0; i < params.length; i++) { 
      if (params[i].getAttribute("name") == "wmode") { 
       var clone = params[i].cloneNode(true); 
       clone.setAttribute("value", "opaque"); 
       params[i].parentNode.replaceChild(clone, params[i]); 
       found = true; 
       break; 
      } 
     } 

     // in case swf_div doesn't already have a wmode param 
     if (!found) { 
      var clone = e.target.cloneNode(true); 
      var param = document.createElement("param"); 
      param.setAttribute("name", "wmode"); 
      param.setAttribute("value", "opaque"); 
      clone.appendChild(param);   
      e.target.parentNode.replaceChild(clone, e.target); 
     } 

     continueScript(); 
    } 
} 

function continueScript() { 
    document.body.appendChild(myDiv); 

    // do wonderful things 
}

我還是不明白，爲什麼腳本需要在Chrome瀏覽器的wmode變化，但不是在FF。但既然是這樣，並且wmode = opaque具有性能成本，我會在進行更改之前進行瀏覽器檢查。瞭解哪個特定功能或規則控制了這種分層行爲以便我的支票可以更加精確會非常有幫助。

來源

2012-01-18 18:53:04 tuff

，當您嵌入在HTML中的SWF wmode您使用的？您將需要使用wmode'opaque'來堆疊Flash元素頂部的HTML元素。

來源

2012-01-15 19:24:58 JonnyReeves

如果用戶腳本能夠在外部Flash對象上設置參數，請問您能解釋一下嗎？否則，它看起來好像你忽略了我的問題。 – tuff 2012-01-15 19:51:59

將格在Flash對象與userscript

回答

相關問題