水平中心，並且不垂直抵消其他內容

我有一個基於Flash的網站。我想定位一個廣告與它頂部的JavaScript（水平居中像網站）。水平中心，並且不垂直抵消其他內容

<script type="text/javascript"> 
var pw_d=document; 
pw_d.projectwonderful_adbox_id = "00000"; 
pw_d.projectwonderful_adbox_type = "0"; 
</script>

flash網站全部在1個flash容器中。我計劃在Flash網站中留下一個視覺空白，以便將廣告懸停。

我不知道要做到這一點的HTML或JavaScript。仍在搜索，這似乎可能有點普遍。

我想我將使用DIV（S）

參考網站：

http://www.charbythevampirate.com/shell.html?page=comics&comic=24

來源

2011-02-10 SketchBookGames

這是我嘲笑的東西。

http://jsfiddle.net/meNVU/

基本上，你要絕對定位在CSS圖像，然後同時設置top和left性爲50％。之後，將margin-left和margin-top分別設置爲寬度* -1的一半和高度* -1的一半。然後，只需在<object>上設置z-index即可將閃光燈嵌入到0，將z-index嵌入到圖像中。這應該（並且）使您走上正確的軌道。

來源

2011-02-11 23:34:48

包裝你的腳本在div

<div style="width:auto;margin 0 auto;padding-bottom: 10px"> 
<script type="text/javascript"> 
var pw_d=document; 
pw_d.projectwonderful_adbox_id = "00000"; 
pw_d.projectwonderful_adbox_type = "0"; 
</script> 
</div>

padding-bottom: 10px;將在下面留下一定的空間，在閃光燈的其餘部分之前添加，或者您可以將其取出，或者增加像素數量。

來源

2011-02-10 22:02:31 Cfreak

這個例子中由馬特·麥克唐納：https://stackoverflow.com/users/342129/matt-mcdonald

http://jsfiddle.net/meNVU/

*我的最終代碼

shell.css

body {background-color: #000000;} 

div#ad 
{ 
    width: 728px; 
    height: 90px; 
    background-color: #000000; 
    margin-left: -365px; 
    margin-top: 77px; 
    position: absolute; 
    left: 50%; 
    z-index: 1; 
}

shell.html（這需要我的閃存對象被包裹在JavaScript中用於調整閃存大小，用於瀏覽器滾動條）

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Charby The Vampirate</title> 

<link rel="stylesheet" 
type="text/css" href="shell.css" /> 


<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script> 
<script type="text/javascript"> 

var myQueryString=document.location.search; 
if (myQueryString[0]='?') 
    { 
     myQueryString=myQueryString.substr(1, myQueryString.length-1); 
    } 
var flashvars = { 
    dat: escape(myQueryString) 
}; 
var is_chrome = navigator.userAgent.toLowerCase().indexOf('chrome') > -1 
if(is_chrome == true){ 
    var params = { 
     allowFullScreen: "true", 
     menu: "false", 
     wmode: "transparent" 
    }; 
}else{ 
    var params = { 
     allowFullScreen: "true", 
     menu: "false", 
     wmode: "window" 
    }; 

} 
var attributes = { 
    id: "resized", 
    name: "resized", 
    wmode: "window" 
}; 

swfobject.embedSWF("shell.swf", "resized", "100%", "100%", "10.0.0", "expressInstall.swf", flashvars, params, attributes); 
</script> 



<div id="ad"> 
    <!-- Beginning of Project Wonderful ad code: --> 
    <!-- Ad box ID: 38564 --> 
    <script type="text/javascript"> 
    <!-- 
    var pw_d=document; 
    pw_d.projectwonderful_adbox_id = "43066"; 
    pw_d.projectwonderful_adbox_type = "5"; 
    //--> 
    </script> 
    <script type="text/javascript" src="http://www.projectwonderful.com/ad_display.js"></script> 
    <!-- Ending of Project Wonderful ad code: --> 
</div> 

</head> 

<body> 
<div id="resized" align="center"></div> 
</body> 
<script> 
function ResizeFlash(newHeight){ 

    $("#resized").css("height",newHeight); 
} 
</script> 
</html>

來源

2011-02-10 22:52:09 SketchBookGames

很高興看到你得到它的工作。對不起，我沒有看到它。 – 2011-02-10 23:34:24

水平中心，並且不垂直抵消其他內容

回答

相關問題