jQuery的淡入不工作

是否有人可以告诉我，我做错了什么：jQuery的淡入不工作

风格：

.warning{border: 1px solid #F0AAAA; background:#FFBABA; color: #C90000;}

标记：

<p class="warning">A successful authorization already exists. 
        Further authorizations are not allowed at this time.</p>

脚本：

$().ready(function() { 
    alert($(".warning").html());  // WORKS 
    $(".warning").fadeIn(4000);  // DOESN'T WORK 
});

来源

2010-08-03 DS.

你在期待淡入（）做什么？如果.warning不可见，fadeIn将使其可见，但根据您的CSS，没有理由期望它被隐藏。 – 2010-08-03 17:10:35

我的情况是，当页面加载时，无论如何都会显示警告div。我只是想在用户登陆该页面后慢慢淡化它。所以我不想在样式表中设置display：none。但正如Nick在下面提到的.hide（）。fadeIn（）正是我在这种情况下所需要的。 – 2010-08-03 18:28:55

除非元素被隐藏，否则不会出现淡化，您需要这样做mething这样的：

$(".warning").hide().fadeIn(4000);

You can give it a try here，也$()被弃用1.4+，你应该使用$(document)或较短的版本，像这样：

$(function() { 
    $(".warning").hide().fadeIn(4000); 
});

另一种方法是给元素的display: none开始但是对于JS禁用的用户来说这会中断，或者如果JavaScript错误发生阻止淡入淡出，那么您可能需要避开此方法。

来源

2010-08-03 17:10:11

那正是错误！谢谢！ – 2010-08-03 18:13:10

正是我在找...真棒... – NiK 2012-08-27 23:05:38

正确！ @nick carver这就是我想要的 – Shrivallabh 2015-02-19 11:59:09

将display:none添加到您的css代码中。

.warning{border: 1px solid #F0AAAA; background:#FFBABA; color: #C90000;display:none}

来源

2010-08-03 17:11:11 dejavu

谢谢你的回应！由于上述响应中指出的缺陷，我避免了这种解决方案。 – 2010-08-03 18:14:32

我会倾向于认为你想要一些事件来管理的法丹。看到这里的工作例如：http://jsfiddle.net/hPHPn/

这样：

$(document).ready(function(){ 
    $(".warning").hide();// hide it initially 
    $('#unhideit').click(function(){ 
     $(".warning").fadeIn(4000);       }); 
});

对于一些简单的标记：

<p class="warning">A successful authorization already exists 
    for this Quote ID. Further authorizations are not allowed at this time.</p> 
<input type="button" id="unhideit" value="clickme" />

来源

2010-08-03 17:30:56

我最近做了同样的事情在我的应用程序。在我html文档的顶部，我有：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> 
<script type="text/javascript" src="advtemp3jquery.js"></script>

它说src="advtemp3jquery.js的部分是指我的外部.js文件。我发现将代码保存在外部文件中更加简单。

的脚本执行以下操作：

$(document).ready(function() { 
    $('.header1,.header2').fadeIn('4000'); 
});

来源

2012-12-08 01:01:43 user1880276

jQuery的淡入不工作

回答

相关问题