Sitelerimizde yer alan açılır menüleri oluşturmak kullanmak kadar kolay ve zevklidir. ul etikeni açıyoruz ve ana menü başlıklarını li etiketi içerisine yazıyoruz.

<ul class="dropdown">
<li><a href="#">Konu Başlıkları</a></li>
<li><a href="#">Ana Sayfa</a></li>
<li><a href="#">İletişim</a></li>
<li><a href="#">Hakkımızda</a></li>
</ul>

Web sitelerinde fotografların kullanımları ve kullandığımız fotografların kullanıcılara sunum şekli herzaman için önem arz etmiştir. Galerimizde yer alan fotograflar çok ve sitemizdeki kullanım alanımız sınırlı ise fotografı dizerek değildi bir botun, fotograf veya link’e tıklanıldığında galerimizi ekrana getirebilir ve galerimizdeki fotograflarımız kullanıcılara bu şekilde sunabiliriz, ilk olarak html kodlarımızdan başlayalım.

Web sitelerin de dropdown menuleri çok sıklıkla kullanabiliyoruz. Bu örneğimizde css ler uyguladığımız ve mause üzerine geldiginde kendiliginden açılan br menu oluşturmayı ögreneceğiz.
Sayfamızda dropdown menu’nun açılır ve kapanır olmasını sağlayan kodu inceleyelim.

	<script>
		$(document).ready(function(){
			$(".dropdownmenu").mouseenter(function () {
				$("#menu").slideToggle();
			});

			$(".dropdownmenu").mouseleave(function () {
				$("#menu").slideToggle();
			});
		});
	</script>

Yukarıdaki kodlarda :

Bu uygulamamızda sitemizde ve projelerimizde Accordion (açılır) bölümler oluşturmayı öğreneceğiz.
Uygulamamızda açılır uygulama olarak bir form oluşturuyoruz. Fromumuz bir file upload formudur.
Uygulamamızda aşağıdaki javascript ile açılır formumuzun kontrolünü sağlıyoruz. Formumuz sayfa açıldığında gizli olarak geliyor, class’ı warnlink olan link tıklanıldığında aşağıdaki javascript çalışıyor ve form ekrana geliyor .

<script type="text/javascript">
$(document).ready(function(){

	$(".warnlink").click(function(){
		$(".selldiv").slideToggle("slow");
		$(this).toggleClass("active"); return false;
	});

});
</script>