`
IsItLikeThat
  • 浏览: 41228 次
  • 性别: Icon_minigender_1
  • 来自: 北京
文章分类
社区版块
存档分类
最新评论

DivCovoerSelect

阅读更多
<html>   
<head>   
<script>   
function DivSetVisible(state)   
{   
    var DivRef = document.getElementById('PopupDiv');   
    var IfrRef = document.getElementById('DivShim');  
    var text1 = document.getElementById('text1'); 
    
    if(state){

            DivRef.style.width=text1.offsetWidth;
            DivRef.style.height=50;
            DivRef.style.top=text1.offsetTop+text1.offsetHeight;
            DivRef.style.left=text1.offsetLeft;
            DivRef.style.display = "block";   

            IfrRef.style.width = DivRef.offsetWidth;   
            IfrRef.style.height = DivRef.offsetHeight;   
            IfrRef.style.top = DivRef.style.top;   
            IfrRef.style.left = DivRef.style.left;   
            IfrRef.style.zIndex = DivRef.style.zIndex - 1;   
            IfrRef.style.display = "block";
    } else {   
            DivRef.style.display = "none";   
            IfrRef.style.display = "none";   
    }   
}   
</script>   
</head>   
<body>   
<form>
    <input type="text" id="text1" value="aaaaaaaaaa"/>

    <div   
        id="PopupDiv"  
        style="position:absolute;
        top:25px; 
        left:50px;
        padding:4px; 
        display:none;
        background-color:#FFFFFF; 
        color:#000000;
        z-index:100">   
        and a DIV can cover it up<br/>through the help of an IFRAME.   
    </div>

    <br>
    <select>   
    <option>A Select Box is Born ....</option>
    </select> 
    <br>
    <select>   
    <option>A Select Box is Born ....</option>
    </select>
    
</form>   


<iframe   
    id="DivShim"  
    src="javascript:false;"  
    scrolling="no"  
    frameborder="0"  
    style="position:absolute; top:0px; left:0px; display:none;">   
</iframe>

<br>
<br>
<br>
<br>
<br>
<a href="#" onclick="DivSetVisible(true)">Click to show DIV.</a>   
<br>   
<br>   
<a href="#" onclick="DivSetVisible(false)">Click to hide DIV.</a>   
</body>   
</html>   

 

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics