Css ve jquery ile desen kilidi yapımı

Css ve jquery dersleri – desen kilidi yapımı

Selamün Aleyküm değerli takipçilerim, Html site yapımı derslerimizde html sayfa oluşturma ve html sayfalara link verme işlemlerini anlattım ve jquery konusuna da iki dersimde değindim. Bugün hem bildiklerimizi pekiştirmek adına hemde yeni bilgiler katmak adına uygulamalı bir örnek yapacağız.  Bu uygulama ile akıllı telefonlardaki “Desen Kilidi” sistemini web ortamında yaparak mantığını az da olsa kavramanızı sağlayacağım. Telefondaki gibi desen çizerek doğru veya yanlış şifreler ile giriş yapmaya çalışacağız.

Css Dersleri” ve jquery dersleri‘nin bir arada olduğu konunun videosu

25 Aralık 2016
bosluk

jquery ile kendi sliderinizi yapın

Merhaba dostlar, bugün sizlere slider yapımı hakkında bilgi vereceğim. Biliyorsunuz heryerde hazır sliderler var ancak bunlar bazı insanları tatmin etmiyor tamamen istediği şekilde slider bulamayanlar oluyor bunun için kendi sliderinizi yapmanız için sizlere konuya giriş yaptım. Sadece birkaç kod ile jquery slider yapımı konusunda kafanızda mantığı az çok oturacaktır.
Kodları indirmek için tıkla

Kodları görüntülemek için tıkla

 

Kullandığımız kodlar

//jquery kodları

$(document).ready(function() {

	$(".kucuk").mouseover(function(){
		var src = $(this).attr("src");
		$("#buyuk").attr('src',src);
	})

});

//html kodları

	<img id="buyuk" alt="" src="1.png" width="610" />

	<img class="kucuk" alt="" src="1.png" width="150" />
	<img class="kucuk" alt="" src="2.png" width="150" />
	<img class="kucuk" alt="" src="3.png" width="150" />
	<img class="kucuk" alt="" src="4.png" width="150" />

29 Temmuz 2015
bosluk

jquery derslerine giriş – hareketli div

Daha önceki derslerimde html ve css dersleri üzerinde durmuştum ancak bugün özel istek geldiği için jquery derslerine giriş yapmak istedim.

Bu dersimizde jquery’nin animate özelliğini kullanarak hareketli div ler nasıl yapılır onu göstereceğim. bunu kullanarak jquery hareketli resim gibi hareket gerektiren işlemleri yapabilirsiniz.

Video da oluşturduğum hareketli menü kodları‘nın tamamını buraya tıklayarak indirebilirsiniz.

18 Temmuz 2015
bosluk
jquery kodları Son Yazılar