Question

我想使用display: none;来定义样式的对象：

dojo.fx.wipeIn({
node: dojo.byId("target"),
duration: 500
}).play();

但动画无法播放。什么是问题？

我使用它来显示显示属性但仍然没有显示任何内容。警报消息为空。

    dojo.fx.wipeIn({
        node: dojo.byId("target"),
        duration: 500,
        beforeBegin: function(){
            alert(dojo.byId("target").style.display);
        },
        onEnd: function() {
            alert(dojo.byId("target").style.display);
        }
    }).play();

Answer 1

这对我来说非常简单：

<html>
<head>
    <title>wipeIn test</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/dojo/1.3.2/dojo/dojo.xd.js"></script>
    <script type="text/javascript">
        dojo.require("dojo.fx");

        dojo.addOnLoad(function() { 
                dojo.fx.wipeIn({node: 'target', duration: 500}).play();
        });
    </script>
</head>
    <body>
        <div id="target" style="display:none; background-color: #444; color: #fff; height: 400px; width:300px;">
            <br />Unnecessary animation :-)
        </div>
    </body>
</html>

你可以发布更多你正在使用的代码吗？

Answer 2

检查一下：

<html>
<head>
    <title>wipeIn test</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/dojo/1.3.2/dojo/dojo.xd.js"></script>
    <script type="text/javascript">
        dojo.require("dojo.fx");

        dojo.addOnLoad(function() { 
                dojo.fx.wipeIn({node: 'target', duration: 500}).play();
        });
    </script>
    <style>
        #target {
            display:none; background-color: #444; color: #fff; height: 400px; width:300px;
        }
    </style>
</head>
    <body>
        <div id="target">
            <br />Unnecessary animation :-)
        </div>
    </body>
</html>

在样式表中使用display: none; dojo faild。

Answer 3

不确定原因，但似乎当display: none;与html一致时，它可以正常工作。这就是简单示例在Dojo / fx文档页面上工作的原因。

<div id="target" style="display:none; background-color: #444; color: #fff; height: 400px; width:300px;">
   <br />Unnecessary animation :-)
 </div>

对于style =“display：none;”的对象的dojo.fx.wipeIn问题

3 个答案: