0

我遇到了一些麻烦;我希望这行文本在页面加载时自动淡入淡出。但是现在它什么也没做,我错过了什么吗?

这是我的代码,我最近正在查看与此主题类似的以前的 stackoverflow 帖子,但我无法让它工作。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN
"http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>New Web Project</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js"></script>
<script src="js/jquery-1.6.3.min.js"></script>
<script src="fancybox/jquery.fancybox-1.3.4.js"></script>
<script>
  $(document).ready(function()
  {
    function fade(element)
    {
      var op = 1;
      // initial opacity
      var timer = setInterval(function()
      {
        if (op <= 0.1)
        {
          clearInterval(timer);
          element.style.display = 'none';
        }
        element.style.opacity = op;
        element.style.filter = 'alpha(opacity=' + op * 100 + ")";
        op -= op * 0.1;
      }, 50);
    }//closes function

  });
  //closes document.ready function
</script>
</head>
<body>
<div id="fade" style="background-color:#66FFFF;width:500px;
height:100px;text-align:center;">
  <br />
  "This text should fade in and out"
</div>
<br />
<br />
</body>

4

2 回答 2

1

您还可以通过使用 fadeToggle() 来简化您的代码(除非您想使用自己的淡入淡出逻辑)。

$(document).ready(function(){
    setInterval(function(){
        $("#fade").fadeToggle(400);
    }, 1500);
});

假设您真的希望它像一个闪烁标签一样!:-)

看看小提琴

于 2013-07-04T19:34:27.563 回答
1

我认为您忘记在初始化结束时调用该方法。添加:

     fade($("#fade"));
于 2013-07-04T19:23:06.100 回答