使用filter时,IE7并不总是使控件不可见:alpha(不透明度:0)

时间:2011-12-19 16:38:30

标签: asp.net css internet-explorer-7

我的表单并不总是呈现不透明度设置为0的realupload。有人看到我遗漏的任何内容吗?

 <style type="text/css">
   .realupload
    {
        position: absolute;
        top: 0;
        width: 270px;
        right: 0; /* start of transparency styles */
        opacity: 0;
        -moz-opacity: 0;
        filter: alpha(opacity:0); /* IE7 and under */
        -ms-filter: "Alpha(Opacity=0)"; /* IE8 */ /* end of transparency styles */
        z-index: 3; /* bring the real upload interactivity up front */
    }
</style>

<asp:FileUpload ID="realupload" runat="server" Width="75%" OnChange="this.form.fakeupload.value = this.value; javascript: checkFile(); Remove(this); return false;"
                                CssClass="realupload" onkeydown="return (event.keyCode==9);" onpaste="return false;"
                                ToolTip="Click to browse your computer to select the File you would like to import" />

2 个答案:

答案 0 :(得分:0)

您目前将样式设置为类而不是ID。将.realupload更改为#realupload,看看是否会发生任何变化。

答案 1 :(得分:0)

我来了,我征服了。我最终将fileupload控件包装在它自己的div中,并将div上的不透明度设置为0而不是它自己的控件。这照顾了不透明度在控件上呈现的葬礼失败。谢谢你的建议。

    .realuploadcontainer
    {
        position: absolute;
        top: 0;
        width: 370px;
        right: 0; /* start of transparency styles */
        /* Good browsers */
        opacity: 0.0;
        /* IE 8 */
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
        /* IE 5-7 */
        filter: alpha(opacity=10);
        /* Safari 1.x */
        -khtml-opacity: 0.0;
        /* Netscape */
        -moz-opacity: 0.0;
        /* end of transparency styles */
    }
    #realupload
    {
        position: absolute;
        top: 0;
        width: 270px;
        right: 0; /* start of transparency styles */
        z-index: 2; /* bring the real upload interactivity up front */
    } 


    <div class="upload">
        <div class="fakeupload">
           <input type="text" name="fakeupload" id="fakeupload" onkeydown="return (event.keyCode==9);"
                  onchange="javascript: checkFile(); return false;" />
        </div>
        <div class=realuploadcontainer>
            <asp:FileUpload ID="realupload" runat="server" Width="100%" AutoPostback="false" 
OnChange="this.form.fakeupload.value = this.value; javascript: checkFile(); return false;" 
onkeydown="return (event.keyCode==9);" onpaste="return false;" 
ToolTip="Click to browse your computer to select the file you would like to import" />
        </div>
    </div>