bgcolor animation using jquery

im using jquery animation for the first time.i have read that animation can be done on .Toggle() or.click() functions but i want to suppose chage a bgcolor of a div on page load. i tried it but its not working here is my code.

<html> 
<head>   
<scriptsrc="http://code.jquery.com/jquery-latest.js"></script>
 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js">
</script>   
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery- ui.min.js">
</script>

<script>   $(document).ready(function(){ 
$('block').animate({ backgroundColor: "black" }, 1000);   
});   
</script>   
<style>   
.block { 
color: white;
background-color: #68BFEF;
width: 150px; 
height: 70px;
margin: 10px;    }   
</style> 
</head> <body >   
<div class="block"> hi</div>
 </body> 
</html>

Answers


The animation works, your jQuery selector is wrong.

$('.block').animate({ backgroundColor: "black" }, 1000);

Notice the '.' in front of 'block'. You were selecting all elements named block (<block>). With the '.', all elements with the class 'block' get selected.


jQuery can't animate colors by default. You can download a plugin such as jQuery UI or Color Animation Plugin to have that feature available.


Need Your Help

Splitting a list using an index

list split ocaml

I have a list of integers named t that has an even length n = List.length t. I want to get two lists, the partition of t from index 0 to (n / 2 - 1), and the partition of t from index (n / 2) to (n...

Creating Multiple DropDownLists

c# asp.net forms

I have a table that includes 27 DropDownLists for user input. My table has 27 occurrences of this HTML: