JQuery change background using <input type = "range">

Question

How to do

I recently taught some basic jQuery, so I came across the idea of ​​adding a slider to change the background color of my page. I figured out the parts of .click and .css - works great with divs, which is incredibly interesting; but I have a little problem with implementing it using a range. I think this is just a problem with targeting, but I hit a little against the wall and would really appreciate your help :)

Paste the demo page here: http://www.weleasewodewick.com/redesign2/test.php

The page uses http://flowplayer.org/tools/demos/rangeinput/index.html next to the default jQuery library.

Script:

<script type='text/javascript'> $(function(){ $(":range").click(function () { $("body").css("background","red"); }); }); </script> 

Range:

 <input type="range" name="background_pick" min="1" max="5" step="1" value="3" /> <script>$(":range").rangeinput();</script> 

Hope this is clear enough - if you need more information, just let me know.

Answer 1

I'm not quite sure what you are trying to do here, but t it seems that the range input has no click event. Change it to "change" and it will work.

 $(":range").change(function () { $("body").css("background","red"); });