透明的box背景_html-js-css

概述透明的box背景

下面是内存溢出 jb51.cc 通过网络收集整理的代码片段。

内存溢出小编现在分享给大家，也给大家做个参考。

<!DOCTYPE HTML PUBliC "-//W3C//DTD HTML 4.0 Transitional//EN"        "http://www.w3.org/TR/REC-HTML40/Transitional.dtd"><HTML><head><Title></Title><Meta http-equiv="Content-Type" content="text/HTML; charset=utf-8" ><style type="text/CSS">body {     background: url(./water_lilIEs.jpg);     background-repeat: no-repeat;}/*This is where the magic happens!*/div.Box {     /*Any propertIEs you'd want the Box to have.*/     /*Would probably be position,dimension type stuff.*/     /*Though personally I would have a div outsIDe this       to control the dimensions.*/     border: 1px solID #000000;     position: relative;     wIDth: 100%;}div.Box_contents {     background-color:transparent;     height: 100%;     position: relative;     wIDth: 100%;     z-index: 101;}div.Box_background {     background-color: white;     height: 100%;     filter:Alpha(opacity=75); /* IE's opacity*/     left: 0px;     opacity: 0.75;     position: absolute;     top: 0px;     wIDth: 100%;     z-index: 99;}</style> <script type="text/JavaScript">function change_w(ID,pixels) {     var x = document.getElementByID(ID);     x.style.wIDth = x.offsetWIDth + pixels + "px";}function change_h(ID,pixels) {     var x = document.getElementByID(ID);     x.style.height = x.offsetHeight + pixels + "px";}/*This function is meant to be used when you are needingfaux getElementsByname() in IE. IE seems so use the 'ID'attribute instead of 'name' when you use getElementsByname().tag = This tag name that the 'name' attribute you want to       get is attached to. like if you called getElementsByTagname().      name = The value of the 'name' attribute you want.*/function getElementsByname_IEfix(tag,name) {     var elem = document.getElementsByTagname(tag);     var arr = new Array();     for(i = 0,iarr = 0; i < elem.length; i++) {          att = elem[i].getAttribute("name");          if(att == name) {               arr[iarr] = elem[i];               iarr++;          }     }     return arr;}/*This function resets the height and wIDth of the backgroundto that of it's parent element's height and wIDth.tbg_ID = This is the value of the name attribute you named all your         backgrounds.*/function transparentbg(tbg_ID) {     var bak = getElementsByname_IEfix("div",tbg_ID);     for(i = 0; i < bak.length; i++) {          bak[i].style.height = bak[i].parentNode.clIEntHeight + "px";          bak[i].style.wIDth  = bak[i].parentNode.clIEntWIDth + "px";     }}</script></head><body onload="transparentbg('bg_name')" onclick="transparentbg('bg_name')"><div >               <div  ID="Box">          <div  name="bg_name"> </div>          <div >               WIDth: <input type="button" value="+" onclick="change_w('Box',30);" /> / <input type="button" value="-" onClick="change_w('Box',-30);" /><br />               Height: <input type="button" value="+" onclick="change_h('Box',30);" /> / <input type="button" value="-" onClick="change_h('Box',-30);" /><br />               <!-- This is a fix that is mainly for IE. Otherwise you'll get white space where you don't want it.-->               <div >                    This is the Box contents! :O <br />                    You see,the background will cover the whole div block no matter how wIDe or tall!                    <br />                    <br />                    <br />                    Look at me! More content!               </div>          </div>     </div></div></body></HTML>

以上是内存溢出(jb51.cc)为你收集整理的全部代码内容，希望文章能够帮你解决所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。

总结

以上是内存溢出为你收集整理的透明的box背景全部内容，希望文章能够帮你解决透明的box背景所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。

欢迎分享，转载请注明来源：内存溢出

原文地址: http://outofmemory.cn/web/1097185.html