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

html dersleri 4 – menü yapımı

Merhaba arkadaşlar, uzun süredir yeni yazı yazmamıştım ama yorumlar gelince  yeniden yazmaya başlamayı düşünüyorum. daha önceki html konularında bazı fonksiyonları göstermiştim ilk 3 dersi inceleyerek bunları görebilirsiniz 4. dersimizde ise örnek olarak html menü‘nün nasıl yapılacağını göstereceğim.

Yalnızca html kullanacağım için biraz basit olacak ancak bu yazı html dersi olduğu için html imkanlarını kullanacağız.

Notlar;
width   = Genişlik

height  = Yükseklik

background = Arka plan

<table>  = Tablo oluştur

<tr>         = Tabloda satır oluştur

<td>        = Tabloda sütun oluştur

<input>  = nesne oluştur


<html>
<head>
<title>Html Dersleri 4</title>
</head>
<body>

<table align="center" width="800" height="40" background="menu.png">
<tr>

<td>
Ana sayfa
</td>

<td>
Menu 2
</td>

<td>
Menu 3
</td>

<td>
İletişim
</td>

<td align="right">
<input type="text"> <input type="submit" value="Ara">
</td>

</tr>
</table>

</body>
</html>

Gördüğünüz üzere bir tablo oluşturup arkaplanına mavi tonlu bir png resmi atıp içerisinde sütunlar oluşturarak menu elemanlarını oluşturduk ve en son da ise bir arama nesnesi ile buton nesnesi oluşturup bu sütunu sağ tarafa kaydırdık böylelikle html menü örneğimizi tamamlamış olduk. bu menulere link vererek o menüye tıklandığında hangi sayfaya gitmesini istiyorsak oraya yönlendirme işlemini de yapabiliriz link örneğini önceki yazımda zaten göstermiştim.

Kodların Browserde Nasıl Görüntüğüne Bakmak İçin Tıklayın
İlgi gördüğü sürece yazılara devam etmeyi düşünüyorum takıldığınız yerleri yorum bölümünden sorabilirsiniz.

21 Şubat 2015
bosluk
jquery kodları Son Yazılar