Changing the background color of a

section

2020-04-20 05:46发布

I'm trying to use jQuery to change the background color of a <div> section when pressing on a button, and below is the code to do that. Why isn't it working?

HTML file

<html>
<head>
<script type="text/javascript" src="jquery-1.6.4.js"></script>
<script type="text/javascript" src="script.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>

</html>

script.js

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

Thanks.

标签： jquery jquery-animate

3条回答

戒情不戒烟

2楼-- · 2020-04-20 06:12

Ensure you include the CSS selector inside the jQuery that you wish to target.

$("bgcolor").click(function(){

Should be:

$("#bgcolor").click(function(){

Because you are targeting an ID.

0人赞添加讨论(0) 举报

可以哭但决不认输i

3楼-- · 2020-04-20 06:15

From the jQuery website:

All animated properties should be animated to a single numeric value, except as noted below; most properties that are non-numeric cannot be animated using basic jQuery functionality. (For example, width, height, or left can be animated but background-color cannot be.)

Use jquery UI package to animate colors.

0人赞添加讨论(0) 举报

▲ chillily

4楼-- · 2020-04-20 06:31

You have several problems:

Your selector is wrong: $("#bgcolor")
You're missing a closing </div> tag.
You need jQueryUI to animate background-color.

HTML:

<input type="button" id="bgcolor" value="Change color"/>
<div id="name">
Abder-Rahman
</div>

JS:

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

Your code, fixed (and working with jQueryUI included): http://jsfiddle.net/andrewwhitaker/rAVj9/

0人赞添加讨论(0) 举报

Changing the background color of a section

采纳回答

编辑标签

举报内容

检举类型

检举原因

检举说明(必填)

打开微信“扫一扫”，打开网页后点击屏幕右上角分享按钮

付费偷看金额在0.1-10元之间

Changing the background color of a
section