jQuery color Nesnesi Kullanımı

sdkbyrm

olwα.ɴeт
Üyelik Tarihi
23 Aralık 2020
Mesajlar
813
Beğeniler
1
Puanı
3
Ticaret: 0 / 0 / 0
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:


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>
 
Üst Alt