Anasayfa İletişim RSS
 
Şimdi Üye Ol | Şifremi Unuttum
 
Anasayfa » Javascript (26 ders)
 
Ortadan Ekrana Genişleyen Kare

Yazar: Osman Durmuş  
Eklenme: 16.10.2007   Okunma: 1243    Puan: 3   Seviyesi:  Orta
Bu dersimizde Javascript yardımı ile div katmanı kullanarak ortadan ekrana doğru genişleyen kare yapalım.

3 tane div katmanımız var diyelim. Bunların ilk baştaki görünürlükleri "hidden" yani gizli olsun. Linklere "onclick" özelliği verirken:

<a href="#" onclick="aha('a','b','c')">SGH 200</a>


şeklinde link yerine # koyarsak çağırdığımız fonksiyonun atadığı değere gider.

Burada fonksiyonlardan da söz edeyim.

"aha" adlı fonksiyonumuz 3 tane değer alıyor. Fonksiyonumuzu çağırırken (aha('a','b','c') divlere atadığımız id'leri gönderiyoruz. Id'ler arasına ' ' koyarsak işlem sırasını belirtmiş oluruz, yani önce a id'si gidecek ve visible(görünen) olacak diğer ıd'ler hidden (gizli)olacak anlamına gelir.

Fonksiyonun içeriğine bakarsanız, anlatmak istediğimi daha net görebilirsiniz. Javascript mantığını bilen arkadaşlar açısında anlama problemi olmayacaktır.


<html>
<head>
<script>
function aha(id1,id2,id3){
	document.getElementById(id1).style.visibility="visible";
	document.getElementById(id2).style.visibility="hidden";
	document.getElementById(id3).style.visibility="hidden";
}

</script>
</head>
<body>

<a href="#" onclick="aha('a','b','c')">SGH 200</a><br>
<a href="#" onclick="aha('b','a','c')">SGH 300</a><br>
<a href="#" onclick="aha('c','a','b')">SGH 900</a>

<div id="a" style="position:absolute;width:150;height:200;left:100;top:15;visibility:hidden">
Samsung SGH 200<br>
Bulutudu var<br>
Radyosu var<br>
Kızılötesi bile var
</div>

<div id="b" style="position:absolute;width:150;height:200;left:100;top:15;visibility:hidden">
Samsung SGH 300<br>
Bulutudu yok<br>
Radyosu var<br>
Kızılötesi bile var
</div>

<div id="c" style="position:absolute;width:150;height:200;left:100;top:15;visibility:hidden">
Samsung SGH 900<br>
Bulutudu yok<br>
Radyosu yok<br>
Kızılötesi bile yok
</div>
</body>
</html>
 
  • Currently 3.00/5
Değelendirmek için üye girişi yapmanız gerekmektedir
EkleBunu Sosyal Paylam Butonu
Ortadan Ekrana Genişleyen Kare Dersini Yazdırın

"Ortadan Ekrana Genişleyen Kare" dersi için 5 yorum var

16.11.2007 mujox diyor ki:
emeğe saygı herzaman olmalı eline sağlık

08.05.2008 samurai_x diyor ki:
saolasın dostum eline sağlık

21.05.2008 yakari766 diyor ki:
javadan anlamam ama bana sanki burada bi eksiklik var gibi geliyo..
<a href="#" onclick="aha('a','b','c')">SGH 200</a><br>
<a href="#" onclick="aha('b','a','c')">SGH 300</a><br>
<a href="#" onclick="aha('c','a','b')">SGH 900</a>

burada ('a','b','c') düzgün hali
burada ('b','a','c') b den sonra a geliyo ve bunu anlamadım

burada ('c','a','b') c den sonra a ve be gelmesi normal, ikincide b,a,c olmasının mantığını anlamadım
. elimde bu kodlarla 10 tane div ve a,b,c,d,e,f,g,h,i,j,

21.05.2008 yakari766 diyor ki:
sıralama yapmam gerek ve burada mantıksal olarak işin içinden çıkamıyorum . saksı yani kapasitem yetmiyo. hani desek bir sıra atlayıp öyle devam edeceğim ama buradaki sıralam beni çıkmaza soktu.
hadi çık işin içinden.

27.06.2008 yakari766 diyor ki:
Sayın Osman Durmuş , bu kod arayıp ta bulamadığım, ve sonunda vesilenizle bulduğumuz çok müthiş decerecede işime yarayan bir kod. çok çok çok teşekkür ederim.
Hakkınızı helal edin, çünki hazırladığımız wb sitesinde kullandık.

Üye olmadan yorum ekleyemezsiniz !


UYARI: SANALKURS'ta yer alan materyaller ile ilgili her türlü sorumluluk hazırlayan veya gönderene aittir. SANALKURS'ta yer alan hiçbir makale, yazarından izinsiz başka bir yerde yayınlanamaz. SANALKURS kullanıcıları ve üyeleri, üçüncü kişilerin telif hakkı sahibi bulunduğu her türlü fikri eser, fotoğraf, resim vb. materyal ve ürünleri kullanamazlar. SANALKURS kullanıcı ve yazarlarının, üçüncü kişilerin telif hakkı sahibi olduğu yazı, resim vb. ürünleri kullanması durumunda, her türlü hukuki ve cezai sorumluluk kendilerine aittir. Söz konusu haksız kullanım nedeniyle SANALKURS .NET'in hiçbir hukuki sorumluluğu bulunmamakta olup, haksız kullanım nedeniyle SANALKURS.NET'in üçüncü kişilere ödemek zorunda kalabileceği her türlü tazminat ve/veya adli/idari para cezaları ilgili Sanalkurs kullanıcılarından rücu edilecektir.
 İSTATİSTİKLER
XML Kaynağımızdan yararlanarak sitemizdeki derslerimizi masaüstünüzden yada web sitenizden takip edebilirsiniz
ÇEVRİMİÇİ 239 Ziyaretçi, 28 Üye (1 Gizli)
Umutweb, fubo, orhanmusellim, fatih, semra.18, bilalözdemir, Serkan61, timur1903, zorbey76, serdar0758, handew, suna su, JrxxLeoN, selinay81, repla_lkjn, Fuat Şengül, BlueDream, TaYFa, omerfarukakkaya, pinar_3474, deadly2001, halukca35, st.riddler, gsli_ahmet, S.ince, Aden, sertany
BUGÜN DOĞUM GÜNÜ OLAN ÜYEMİZ:
elcins (19)
Bugün: 4743, Dün: 6596, Bu Ay: 23642, Toplam Ziyaret: 1880645, Toplam Üye: 132958, Son Üye: muratözmen
Toplam Ders: 2011, Toplam Yazar: 45, Toplam Dosya: 34, Toplam Link: 55
   
RSS Kaynağımızdan yararlanarak sitemizdeki derslerimizi masaüstünüzden yada web sitenizden takip edebilirsiniz