WEB 2. DNM 1. SNV (JS-JQUERY)

WEB TABANLI UYGULAMA GELİŞTİRME DERSİ  1. UYGULAMA SINAVI SORULARI

SORU 1 (JAVASCRIPT)  25p

Kontrol butonuna tıklandığında;

·         Kutu boşsa BOŞ BIRAKMAYIN uyarısını görünür yapın;

·         Değilse bu uyarıyı gizleyip;  metin kutusuna yazılan metin içerisinde   “@”  işareti  olup olmadığını alert ile ekranda gösterin.

SORU 2 (JQUERY) 25p

Kırmızı kutuya çift tıklandığında;

·         kutunun yukarı doğru kayarak yok olmasını sağlayın

·         SORU 3 başlığı altındaki “Kutuyu göster ve yaz” butonunun görünür olmasını sağlayın..

SORU 3 (JQUERY)  30p

Kutuyu göster ve yaz butonu tıklandığında;

·         gizlenen kutunun , fade efekti ile tekrar görünür olmasını sağlayın

·         içerisine p etiketi içerisinde “ben geldim” yazdırın.

·         “Kutuyu göster ve yaz” butonunu tekrar gizleyin

SORU 4 (JAVASCRİPT)  20p

 “RENK DEĞİŞTİR” butonu tıklandığında;

• ·         sayfa arka planı rengini siyah ,
• ·         sayfa yazısı beyaz olsun.. 
• ·         .text-muted class’lı yazıyı kırmızı yapın..

CEVAPLAR

//soru 1
	document.getElementById("checkat").addEventListener("click",function(){
		metin=document.getElementById("mail").value;

		if(metin=="") {
			document.querySelector("small").style.display="block";
		}
		else {
			document.querySelector("small").style.display="none";

			if(metin.indexOf("@")>=0) {
				alert("@ işareti var");
			}
			else {
				alert("@ işareti yok");
			}
		}
	})

	//soru 2 
	$(".box").dblclick(function(){
		$(this).slideUp();
		$("#goster").show();
		$(".text-muted").hide();
	});


	//soru 3 
	$("#goster").click(function(){
		$(".box").fadeIn();
		$(".box").html("<p> BEN GELDİM </p>");
		$("#goster").hide();
		$(".text-muted").show();
	});
	
	//soru 4
	document.getElementById("renk").addEventListener("click",function(){
		document.querySelector("body").style.background="#000";
		document.querySelector("body").style.color="#fff";
	})