在过去一个小时左右的时间里,我一直在搜寻Google,但似乎无法找出解决该问题的方法。我刚刚完成了codecademy的jQuery课程,现在正在从事一个项目。由于某种原因,我的代码jquery代码无法正常工作
jQuery的:
$(document).ready(function(){
$("div").css("border", "3px solid red");
$(".storyblocks").mouseenter(function(){
$(this).animate({
height: "+= 20px"
width: "+= 20px"
});
});
$(".storyblocks").mouseleave(function(){
$(this).animate({
height: "-= 20px"
width: "-= 20px"
});
});
});
HTML:
<!DOCTYPE html>
<html>
<head>
<title>Project Website</title>
<link type = "text/css" rel = "stylesheet" href = "stylesheet.css"/>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript" src="script.js"></script>
</head>
我添加了$("div").css("border", "3px solid red");
来检查div是否具有红色边框,并且到目前为止还没有运气。有人说我不需要$(document).ready,但是我不明白为什么不这样做。
请帮忙?
jQuery无法正常工作的问题与将jQuery放在单独的文件中无关,它与一个小的语法错误有关:您的动画属性之间没有逗号,并且动画属性是使用不正确的语法。
这是您的代码,但带有必要的逗号和用于设置属性动画的正确语法:
逗号在这里:
$(document).ready(function () {
$("div").css("border", "3px solid red");
$(".storyblocks").mouseenter(function () {
$(this).animate({
height: ($(this).height() + 20) + 'px',
width: ($(this).width() + 20) + 'px'
});
});
$(".storyblocks").mouseleave(function () {
$(this).animate({
height: ($(this).height() - 20) + 'px',
width: ($(this).width() - 20) + 'px'
});
});
});
在高度声明之后,在下一个声明之前,您需要用逗号分隔。
因为您的jQuery错误,它没有执行任何操作,这就是为什么您没有看到红色边框:)的原因,即使红色边框代码与违规代码是分开的。
高温超导
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句