JQuery .fadeIn不能在我的网站工作
问题描述:
我知道这可能似乎重复,但我无法让我的网站上工作的jQuery。我已经浏览了很多帖子,但仍然无法找到答案。JQuery .fadeIn不能在我的网站工作
这里是我的HTML:
<!DOCTYPE html>
<html>
<head>
<title>Rodeo Rich's Steakhouse</title>
<meta charset="utf-8">
<link rel="stylesheet" href="css/style.css" type="text/css">
<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Holtwood+One+SC" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script type="text/javascript" src="js/main.js"></script>
</head>
<body>
<header>
<a href="index.html"><img src="img/logo.png" id="logo" alt="Rodeo Rich's Steakhouse"></a>
</header>
<nav>
<ul>
<li><a href="menu.html">MENU</a></li>
<li><a href="story.html">OUR STORY</a></li>
<li><a href="giftcards.html">GIFT CARDS</a></li>
<li><a href="contact.html">CONTACT US</a></li>
<ul>
</nav>
<img src="img/logo.png" id="pic" alt="Rodeo Rich's Steakhouse">
</body>
</html>
这里是我的JavaScript文件,该文件没有做任何事情来 “#pic” 代码:
$(document).ready(function(){
$("#pic").fadeIn("slow");
});
- 我知道我的路名称到.js文件是正确的
- 我在我的部分也有Google CDN。
所有帮助将不胜感激! :)
答
您的图片已被隐藏,才可以淡入,因此,例如,你可以这样做:
$(document).ready(function(){
$("#pic").hide().fadeIn("slow");
});
答
你要隐藏你的第一映像(CSS display:none
或用jQuery .hide
)。
这工作:
$('#pic').hide();
$('button').click(function() {
$('#pic').fadeIn('slow');
});
如果你打开浏览器的调试工具,并切换到网络,你得到您的任何.js文件404?控制台是否会抛出任何错误? – Ozrix
你不能淡化已经可见的东西。 –
@KevinB你是否赞成所有答案? :/ –