jQuery kütüphanesi ile html ve css’e bi hareketlilik geldi
Biz de bu hareketliliğin getirdiği rüzgârı arkamıza alarak ilk jQuery makaleciğimizi yazıyoruz. Div arasında iki css sınıfı değişikliğine gideceğiz. Div imizin ilk CSS sınıfı class1 iken biz bunu class2′ye dönüştüreceğiz. Çok basit bir mantığı var, ama çok iş görebilir. Önce jQuery kütüphanesini işleyeceğimiz sayfaya çağırıyoruz:
<script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
Daha sonra aralarında geçiş yapacağımız CSS sınıflarını tanımlıyoruz:
<style type="text/css">
.class1
{
background-color: Aqua;
border: 3px dashed Black;
width: 400px;
height: 200px;
}
.class2
{
background-color: Fuchsia;
border: 6px groove Blue;
width: 400px;
height: 200px;
}
</style>
Şimdi de <script> etiketleri arasına girip jQuery kodumuzu yazıyoruz. Bismillah
<script type="text/javascript">
$(document).ready(function () { // jQuery yi başlatıyoruz.
$("#div1").click(function () { // div1 id li html öğesi tıklandığı zaman:
$(this).toggleClass("class2").html(resim);
});
});
</script>
CSS sınıfı değişimini toggleClass ile sağlıyoruz. this kalıbına dikkat: üst satırdaki #div1 kastedilir. Çalışır halini buradan görebilir, buradan da indirebilirsiniz. İlk jQuery makalemiz biraz basit. İnşallah ileride, daha derin işler yaparız
Şaka bir yana, bundan sonra jQuey Events’a, Ajax’a ve jQuery ve ASP.NET in birlikte kullanımına değineceğiz. Bir sonraki makalede görüşmek üzere … İyi çalışmalar



June 26th, 2010
vestanbul
Posted in 