We can dynamically change the particular div background colour using javascript colour picker
we have to follow 4 steps to done above task
step 1 :include jscolor picker file in ur file
step 2 :create a text box and define a class color
step 3 :create javascript function for change the div background colour according to the selection by using js cookie
step 4 :call the Js-function in text box onblur event
picker.html <html> <head> <title>colour picker demo</title> <script> function pick() //------------------------------------------>step 3 { var elem = document.getElementById("para1").value; var cook=document.cookie="#"+elem; var colour=document.getElementById("change"); colour.style.background=cook; } </script> </head> <body> <div style="height:100px; width:400px;" id="change"> <!--colour change--> </div> <script type="text/javascript" src="jscolor.js"></script> //->step1 Click here: <input class="color" value="" onblur="pick()" id="para1">//->step2 //---------------------------------------------------- >step 4 </body> </html>
Video preview:
Download
No comments:
Post a Comment