Question

我正在编写测试.aspx页面，以确定转换是否是另一个项目所需要的。

我试图显示/隐藏＆＃34; divTest＆＃34;通过使用变换CSS样式。这是代码：

            <%@ Page Language="VB" %>
            <%@ Import Namespace="Ionic.Zip" %>
            <%@ Import Namespace="System.IO" %>
            <%@ Import Namespace="System.Web" %>

            <head>
            <style>

            .shown {
              -webkit-transform: translate(0, 0);
                 -ms-transform: translate(0, 0);
                 -moz-transform: translate(0, 0);
                  -ms-transform: translate(0, 0);
                   -o-transform: translate(0, 0);
                      transform: translate(0, 0);    
            }

            .hidden {
              -webkit-transform: translate(-100%, 0);
                 -ms-transform: translate(-100%, 0);
                 -moz-transform: translate(-100%, 0);
                  -ms-transform: translate(-100%, 0);
                   -o-transform: translate(-100%, 0);
                      transform: translate(-100%, 0);    
            }
            </style>
            </head>


            <script runat="server">
                Sub btnShow_Click(sender As Object, e As EventArgs)
                   divTest.Attributes.Add("class", "shown")
                End Sub

                Sub btnHide_Click(sender As Object, e As EventArgs)
                   divTest.Attributes.Add("class", "hidden")
                End Sub
            </script>

            <html>
            <body>
                <form id="form1" runat="server">

                <div id="divTest" runat="server" style="display: block" class="hidden">
                    Sample text in a div.
                </div>

                <div>
                    <asp:Button ID="btnShow" OnClick="btnShow_Click" runat="server" Text="Show"/>
                    <asp:Button ID="btnHide" OnClick="btnHide_Click" runat="server" Text="Hide"/>
                </div>

                </form>
            </body>
            </html>

我知道脚本和html中的所有东西都已经工作了（我测试了在有问题的div上添加其他测试类的按钮）。这是一个小jsfiddle，具有特定的CSS样式：http://jsfiddle.net/6TMcS/165/

为什么它不在这里工作？

Answer 1

divTest 样式具有 display：none 规则。所以，它总是隐藏的。 将此规则移动到css类。

.hidden {
display:none;
-webkit-transform: translate(-100%, 0);
-ms-transform: translate(-100%, 0);
-moz-transform: translate(-100%, 0);
-ms-transform: translate(-100%, 0);
-o-transform: translate(-100%, 0);
transform: translate(-100%, 0);    
 }

Answer 2

没关系，发生的事情是我加载的网站是在IE中的兼容性视图中。一旦我关闭它，它就有用了。

CSS转换在.aspx页面中不起作用

2 个答案: