Bu yazımızda jQuery ile color nesnesi kullanarak sayfamızda bulunan paragrafın renginin değiştirilmesini sağlayacağız. Sayfamızı çalıştırdığımızda <input type=”color ….> ile eklemiş olduğumuz renk paletinden seçim yaptığımızda paragrafımızda bulunan yazıların renginin değiştiğini göreceğiz.
Kodlarımızı color nesnesinin change olayına yazacağız.
Kodlarımız:
Kodlarımızı color nesnesinin change olayına yazacağız.
Kodlarımız:
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 | <!DOCTYPE html> <html lang=""> <head> <meta charset="utf-8"> <title>Jquery Örnekler</title> <script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js"></script> </head> <body> <p>jQuery Dersleri www.yazilimkodlama.com jQuery Dersleri www.yazilimkodlama.com jQuery Dersleri www.yazilimkodlama.com jQuery Dersleri www.yazilimkodlama.com jQuery Dersleri www.yazilimkodlama.com jQuery Dersleri www.yazilimkodlama.com jQuery Dersleri www.yazilimkodlama.com jQuery Dersleri www.yazilimkodlama.com jQuery Dersleri www.yazilimkodlama.com jQuery Dersleri www.yazilimkodlama.com</p> <input type="color" id="renk"> <script> //Color nesnesinden seçilen renk sayfanın rengi olsun $(document).ready(function() { $("#renk").on("change",function(){ var secilenrenk = $("#renk").val(); $("p").css("color",secilenrenk); }); }); </script> </body> </html> |