您現(xiàn)在的位置： 365建站網(wǎng) > 365文章 > 設(shè)置iframe的背景色及填充iframe

設(shè)置iframe的背景色及填充iframe

文章來(lái)源：365jz.com 點(diǎn)擊數(shù)：1292 更新時(shí)間：2009-12-28 23:15 參與評(píng)論

前幾天在做一個(gè)自定義彈出層時(shí)，需要用到iframe做半透明的背景，但是由于iframe不能直接設(shè)置背景色而苦惱，百度google之后發(fā)現(xiàn)人們大都是給iframe設(shè)置src指向一個(gè)目標(biāo)html頁(yè)面，此頁(yè)面僅僅是在body中設(shè)置背景色。始終覺(jué)得這樣子不太好，一來(lái)是是iframe中頁(yè)面緩存十分嚴(yán)重，日后修改背景色麻煩，二來(lái)如果加訪問(wèn)地址隨機(jī)的話會(huì)導(dǎo)致每次彈框都要刷新。

我的方法：<iframe src="javascript:document.write('<body style=\'background-color:black\'></body>')"></iframe>

這樣一來(lái)，我們不僅僅只可以設(shè)置iframe的背景色了，還可以做很多事，如有時(shí)候要在iframe中放一個(gè)簡(jiǎn)單的圖片，寫幾行字等等，也沒(méi)必要再去寫一個(gè)頁(yè)面來(lái)做指向了。

下面是一個(gè)完整的示例：

<html>
<head>
<script type="text/javascript">
    function ggyy()
    {
    var code = ["<html>"];
    code.push("<body style='color:Red;'>");
    code.push("<img src='/uploads/allimg/200912/20091228231607308.gif'/>");
    code.push("<span style='color:Red;'>這是iframe中的字</span>");
    code.push("</body>");
    code.push("</html>");
        return code.join("");
    }
</script>
</head>
<body>
<iframe width="700px" height="400px" src="javascript:parent.ggyy()"></iframe>
</body>
</html>