Question

$('#main-mission .fade').animate({opacity:1.0;filter:alpha(opacity=100);}, { queue:true, duration:2000 }).animate({opacity:1.0;filter:alpha(opacity=100);}, 1500).animate({opacity:0.0;filter:alpha(opacity=0);}, 800,'linear',function(){
$('#main-mission .fade').html("<font size='3'>... to organize and display the data that people need, to give them the ability to make smarter decisions and purchases that will help the environment, as well as reduce their monthly electricity costs.</font>"); }).animate({opacity:1.0;filter:alpha(opacity=100);}, 2000);

...那就是我的jquery，

<div id="main-mission">
<table><tr height="28"><td width="11"></td><td width="475" style="height: 75px;" class="boxed"><div class="fade" style="opacity:0.0;filter:alpha(opacity=0)"><font size="4">&nbsp;&nbsp;&nbsp;&nbsp;The Spare Our Green Mission ...</font><br><br></div> </td></tr></table>
</div>

那就是HTML。我不太确定为什么不工作......有人可以帮忙吗？

感谢。

Answer 1

您使用了分号，您应该使用逗号分隔动画的css属性。此外，您不需要尝试使用filter属性添加IE支持。试试这个代码，在FF3.5和IE8中进行测试

<html>
<head>
    <script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js'></script>
    <script type='text/javascript'>
        $(document).ready(function()
        {
            $('#main-mission .fade')
                .animate({opacity:1.0}, {queue:true,duration:2000})
                .animate({opacity:1.0}, 1500)
                .animate({opacity:0.0}, 800,'linear',function()
                    {
                        $('#main-mission .fade').html("<font size='3'>... to organize and display the data that people need, to give them the ability to make smarter decisions and purchases that will help the environment, as well as reduce their monthly electricity costs.</font>");
                    })
                .animate({opacity:1.0}, 2000);
        });
    </script>
</head>
<body>
    <div id="main-mission">
        <table>
            <tr height="28">
                <td width="11"></td>
                <td width="475" style="height: 75px;" class="boxed">
                    <div class="fade" style="opacity:0.0;filter:alpha(opacity=0)">
                        <font size="4">&nbsp;&nbsp;&nbsp;&nbsp;The Spare Our Green Mission ...</font>
                        <br>
                        <br>
                    </div>
                </td>
            </tr>
        </table>
    </div>
</body>
</html>

Answer 2

您是否尝试将链条的一部分向下移动到第一个元素，然后一次一个地添加它们以查看损坏的内容？尝试读取和解析是一个很长的函数调用。

Answer 3

我认为非数值应该是filter:"alpha(opacity=0)";之类的引号。你得到了什么错误信息（来自萤火虫，即）？

- 编辑

顺便说一下。 IE8现在使用-ms-filter来表示不透明度。

Answer 4

我同意帕迪。您应该编写一个更简单的代码版本，然后尝试一下。只需拨打一次$.animate()电话。一旦你开始工作，然后加入回调。一旦有效，然后添加链接。

另请注意，您不应使用<font>标记。它不是有效的HTML。

jquery动画没有显示出来

4 个答案: