开发者

jQuery - Background color not changing [duplicate]

This question already has answers here: Closed 11 years ago.

Possible Duplicate:

jQuery animate backgroundColor

Changing the background color of a <div> section

I have the following code trying to change the background color of a text after pressing a button. The case is that it is not doing what it is intended to do. Why is that? What is going wrong here.

HTML code

<html>
<head>
<script type="text/javascript" src="jquery-1.6.4.js"></scr开发者_开发百科ipt>
<script type="text/javascript" src="script.js"></script>
<script type="text/javascript" src="js/jquery-1.6.2.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.16.custom.min.js"></script>
<style type="text/css"> 
#name{
background-color: #FFFFF2;
width: 100px;
}
</style>
</head>
<body>
<input type="button" id="bgcolor" value="Change color"/>
<div id="name">
Abder-Rahman
</body>
</div>
</html>

script.js

$("#bgcolor").click(function(){
    $("#name").animate(
        {backgroundColor: '#8B008B'},
        "fast");}
);

EDIT

I want to notice that I have a folder called: jquery-ui-1.8.16.custom, and this is where I'm putting these files in. And, I have referenced jquery-1.6.4,js as shown above which I also have it in the same folder, in addition to referencing jquery-ui-1.8.16.custom.min.js which is in the js folder in the current folder.

What am I getting wrong here? Isn't this the way to reference jQuery and jQueryUI?

Browser used: Mozilla Firefox 6.0.2

Folder structure:

jquery-ui-1.8.16.custom/abc.html

jquery-ui-1.8.16.custom/script.js

jquery-ui-1.8.16.custom/jquery-1.6.4.js

jquery-ui-1.8.16.custom/js/jquery-ui-1.8.16.custom.min.js

Thanks.


<script type="text/javascript" src="jquery-1.6.4.js"></script>
<script type="text/javascript" src="script.js"></script>
<script type="text/javascript" src="js/jquery-1.6.2.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.16.custom.min.js"></script>

Are the references point correct path? It is working on jsfiddle after removing the references.


Despite the fact that (sorry) your code looks horrible (wrong order of html tags, you include jquery twice, ...) animate() doesn't work with backgroundColor out of the box and you will need the color plugin. mu is too short posted a link to a related thread in his comment on your post.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜