ASerdar.Com Kişisel Blog
jQuery ile Tıklanan Nesnenin Stil Özellikleri Değiştirme
Son olarak paylaşımını yaptığımız jquery ile üzerine tıklanan nesneyi gizlemeden sonra bugünde sizler için jquery ile tıklanan nesnenin stil özellikleri değiştirmeyi göreceğiz.Sayfadaki stili sayfa yenilenmeden değiştirmek için jquery kullandık.Öncelikle kodumuzu görelim.
<html>
<head>
<title>Jquery Örneği</title>
<script src=”https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js”></script>
<script>
$(function(){
$(“p”).click(
function(){
$(this).css(“background-color”, “lightpink”);
$(this).css(“font-size”, “22px”);
});
});</script>
</head>
<body>
<h1>BAŞLIK</h1>
<p>Paragraf 1 </p>
</body>
</html>
Yukarıda ki kodumuzu incelediğimizde p parametresinin click olayında süslü parantezler arasında istediğimiz stili o nesneye ekleyebiliyoruz.Extra stiller eklemek içinde aynı satırı tekrar yapıştırmak yeterli.
$(this).css(“font-size”, “22px”);
font-size kısmına vermek istediğiniz stil özelliğinin türünü yazıyoruz.
22px yerine ise verdiğimiz özelliğe uygun gelen değeri yazıyoruz.
Örnek:
$(function(){
$(“p”).click(
function(){
$(this).css(“background-color”, “lightpink”);
$(this).css(“font-size”, “22px”);$(this).css(“font-weight”, “bold”);
});
});
Bu uygulama ile ilgili demo için:
Bir önceki yazımız olan Tasarımlarınız İçin Uyumlu Renkler başlıklı makalemizde Flat renkler, renk kodları ve uyumlu renk seçimleri hakkında bilgiler verilmektedir.
