Sürekli site açılış
haberi verecek değilim :) Şimdi ki yazımda jQuery ve css ile basit bir yatay
açılır menünün nasıl yapılacağına göz atacağız. Başlangıç noktasında ul ve li
etiketlerinden bir hiyerarşi yaratıyoruz. Eğer kodumuza bakarsak yapıyı rahatlıkla anlayabiliriz, bir nevi ağaç yapısı.

	<ul>
		<li><a href="">Deneme</a></li>
		<li><a href="">Deneme</a>
			<ul>
				<li><a href="">asdasd</a></li>
				<li><a href="">fasdfasdf</a></li>
				<li><a href="">asdfasdf</a></li>
			</ul>
		</li>
		<li><a href="">Deneme</a></li>
		<li><a href="">Deneme</a>
			<ul>
				<li><a href="">sdafasgdasdf</a></li>
				<li><a href="">sdgsadf</a></li>
				<li><a href="">sdfsdfasd</a></li>
			</ul>
		</li>
		<li><a href="">Deneme</a></li>
	</ul>

Sonrasında css ile birlikte biçimlendirmemizi yapıyoruz. Buradaki önemli olan nüans ikinci seviyedeki ul etiketlerini
display:none yaparak ilk etapta görünmemesini sağlamak sonrasında da
position:absolute ile pozisyonunu sabitliyoruz.

    body{font-family:Verdana,Helvetica;font-size:11px;background-color:#333}
	.menu{}
	.menu ul{list-style:none;padding:0;margin:0}
	.menu ul li{float:left;padding:5px;margin:2px;}
	.menu ul li a{color:White;text-decoration:none;font-weight:bold;}
	.menu ul li:hover{background-color:#5a5a5a}

		.menu ul li ul{display:none;position:absolute;}
		.menu ul li ul li{float:none;border-bottom:1px solid #ededed}
		.menu ul li ul li:hover{border-bottom:1px solid #5a5a5a;background-color:Transparent}

En son işlem olarak da jQuery ile üzerine gelinen li nin altında bulunan ul nin görünmesini sağlamak. Neden bu ul görünmüyordu çünkü css de displayını none yapmıştık ;) Koda
baktığımızda gayet basit bir mantığın olduğunu göreceksiniz. Daha değişik açılma
efektleri için
jQuery’ nin efekt kategorisine göz atabilir ve rahatlıkla
uygulayabilirsiniz. Burada aklıma gelmişken projenize

jquery.js yi eklemeyi unutmayın ;)

 $(document).ready(function() {
        $("#menu1 ul li").hover(
            function() {//mouse üzerindeyken çalışacak fonksiyonumuz. (mouseover)
                $("ul", this).slideDown("fast");
        },
            function() {//mouse üzerinde değilken çalışacak fonksiyonumuz. (mousout)
                $("ul", this).slideUp("fast");
        });
    });

Aşşağıda ki örneklerde menülerin farklı şekillerde nasıl çalıştığını görebilir ve kaynağı görüntüleyerek kodları alabilirsiniz. Bir yazının daha sonuna geldik, kalın sağlıcakla..

Trabzonspor’ a Fenerbahçe’ den Gökhan Ünal karşılığında gelen Burak Yılmazın resmi web sayfası yayına girdi. Vallahi biz yaptık diye demiyorum gayet hoş bir site oldu. Özellikle Emrah‘ ı tebrik ediyorum güzel bir iş çıkardı. Allah izin ederse ilerleyen günlerde daha güzel işlerede imza atacağız. Burağa bol gollü günler bizede bol eğlenceli bol bol kahkahalı sevgi ve huzurlu günler diliyorum.

Olimpiyat bayrağının Türkiye’ de ilk kez dalgalanacağı ve 49 ülkeden 4000 sporcunun katılacağı EYOF 2011 Avrupa Gençlik Olimpiyatları’ nın yeni resmi web sitesi yayına girdi. Szn Yazılım olarak bu işe imza atmaktan büyük gurur ve onur duyduk. Her gün geliştirmesine devam ettiğimiz sitenin önümüzdeki haftalarda çok daha güzelleşeceği inancındayız. Şimdilik eleştiriler hep olumlu yönde, elimizden geldiğincede her türlü fikir ve görüşü değerlendirmeye çalışıyoruz. Olimpiyatların Ülkemize ve Trabzon’ umuza hayırlı ve uğurlu olmasını ve kazasız belasız en iyi şekilde icra edilmesini diliyoruz.

Hazırdan ne kadar kaçarsak yaptığımız işin kontrolüde bir okadar elimizde olur. Son zamanlarda elimden geldiği kadar hazır scriptlere bulaşmıyorum. Sebebide ekleme çıkarmalarda yada kişiselleştirmelerde yaşadığım problemler ve beraberinde çok büyük zaman kayıpları. Bu noktada jQuery dertlere deva oluyor desem sanırım abartmış olmam. Bu yazımda çoğu haber sitesinden aşikâr olduğumuz manşet mekanızmasından yapacağız. Kodları gördüğünüzde jQuery nin bize neler sunduğunu daha iyi anlayacaksınız. Kodlar gayet açık ve net, istediğiniz gibi istediğiniz yerini basitçe değiştirebilir, şekilden şekile sokabilirsiniz. Buyrun size jQuery manşet mekanızması;

Örneği buradan indirebilirsiniz !

İlk bakışta garip bir başlık gibi  gelebilir fakat bu tecrübemi sizlerle paylaşmak istiyorum. Her ne kadar başlıkta yazılım geliştiren yazdıysamda esasında işi bilgisayarda birşeyler üreten tüm kullanıcılar için geçerli olan en büyük sorun şüphesiz aşırı konsantrasyondan dolayı veya uzunca saatler aynı şeyler üzerinde çalışmaktan çok basit problemleri çözememe basit yerlerde takılı kalma gibi durumlar kaçınılmazdır. Bu seferde cümle devrik oldu. Şöyle yazmayı deneyeyim, eğer yüksek konsantrasyonlu bir işle meşgulseniz, yaşadığınız en büyük problem zaman zaman basit problemleri çözememe yada basit problemleri çok karmaşık şekilde çözümleme gibi durumlarla karşılaşıyorsunuzdur. Çoğu zaman öyle kapılırızki yemek saati gelir geçer, uyku saati gelir geçer fakat biz haleda kastırırız. Bunun yanında sürekli oturmaktan oramız buramız tutulur, şeklimiz şemalimiz değişir. Namaz kılarak bu durumlardan çok rahat kurtulabiliyoruz. Namaz saatlerinde işlerimizi bir kenara koyup bu dini vecibeyi yerine getirerek ilk etapta kafamız güzel bir şekilde dağılıyor, sonrasında namaz kılarak hareketsiz kalan vucudumuz kendine geliyor, namaz esnasında çoğu zaman aklımıza parlak fikirler yada çözüm yollarıda geliyor. Bu yazı kimilerine çok itici gelebilir fakat yazma gereği hissettim, eğer bir gün bunu denerseniz demek istediğimi çok daha iyi anlayacaksınız…

Otomatik kod tanımlamayı garipsemeyin çünkü intelliSense kelimesinin Türkçe karşılığını bulamadım :) Kısaca intelliSense şu demek; kodu yazmaya başladığınızda otomatik olarak ilgili kodcuklar listeleyen, aynı zamanda fonksyionların açıklamalarını alacağı parametreleri görebildiğimiz, işimizi hızlandırmaktan başka bir şeye yaramayan bir özellik. Bu işlemi jQuery içinde yapabiliyoruz, yani $(document) noktaya bastığımızda ilgili fonksiyonlar geliyor. Bunun için http://code.jquery.com/jquery-1.2.6-vsdoc.js adresindeki vsdoc dosyasını indiriyoruz. Sonrasında http://docs.jquery.com/Downloading_jQuery#Current_Release adresinden en son jQuery dosyasını indiriyoruz. Yapmamız gereken tek şey indirdiğimiz jquery-1.2.6-vsdoc.js dosyasının adını, indirdiğimiz jQuery dosyası adı -vsdoc şeklinde düzenliyoruz. Garip bir cümle oldu bende farkındayım, resimlerden bakarsak daha iyi anlayabiliriz.

Artık önümüzde jQuery yazmak için hiç bir engel kalmadı. Başka bir yazıda görüşmek üzere..