|
Bölünen
Pencereler:
Sayfalarınızın aşağılara
doğru çok uzun olduğu zaman "navigasyon" menülerinin yukarıda
kalması ve sayfanızda aşağıya gidildiğinde kaybolması pek çok
zaman ciddi bir sorun olarak karşımıza çıkıyor. FRAME'ler burada
yardımımıza koşuyor, internet Explorer ve Netscape'in 3. kuşak
browser'larından beri frame yapısı destekleniyor.
Peki 3 tane pencere tek bir HTML'i mi
kullanıyor? Tabii ki hayır. FRAME yapısını belirten bir HTML dosyamızın
yanında her pencere için ayrı bir HTML dosyası kullanacağız. Karışık
gibi görünse de örnekleri verdiğimizde daha iyi anlayacağınızdan
eminiz.
Frame sayfası nasıl hazırlanır?
Frame aslen bir kalıp nileliğindedir. Kalıbın
şeklini belirlemek size kalmış. Bu kalıpla hangi bölüme hangi sayfa
gelecek, boyutu kaç olacak gibi değişkenler belirtilir.
Günümüzün web tasarım araçları
frame'leri başarıyla desteklemektedir.
FrontPage 2000, Dreamweaver, 1st Page 2000
gibi... Ama ne yazık ki kullandığımız FrontPage Express'in çıkış
tarihi itibariyle böyle bir desteği bulunmuyor. Ama sonuçla frame'lere
hakim olmak için her durumda Notepad desteği gerekiyor.
Emre, sayfalarında frame yapısı
kullanmayacak olsa da gelin, hep beraber onun sayfalarım frame'li bir yapıya
dönüştürelim. Ama öncelikle FRAME komutu nasıl kullanılır,
parametreleri nelerdir bir gözden geçirelim.
Frame tanımlama sayfamızda BODY komutunu
kullanmamız gerekmekte. Klasik girişimizi yazalım:
<HTML>
<HEAD>
<TITLE>Frame'li ilk sayfamız</TITLE>
</HEAD>
|
Normal sayfalarımızda
BODY komutunun
yerine burada FRAMESET komutunu kullanacağız. Ama sayfamızın nasıl görüneceğini
de önceden belirlememiz gerekiyor.
Örneğin önce iki dikey parçaya, sonra
da sağda kalan dikey parça iki yatay bölüme ayrılsın diye planlayalım.
Solda kalan dikey parçanın genişliği
150 piksel olsun.
| <FRAMESET cols="150,*"
framespacing="0"
frameborder="0"
border="0"> |
Bu komutta * işareti "ekranın kalan
bölümünü kapla" anlamına gelir.
FRAMESPACİNG, FRAMEBORDER ve
BORDER
komutlarının yaptığı görev aynıdır: framelerin arasında kalan
kenar boşlukları veya kenar kalınlığı. Burada neden birtanesini
kullanmadık diye sorabilirsiniz. FRAMESPACING ve
BORDER komutları
internet Explorer, FRAMEBORDER komutu ise Netscape'in değişik
versiyonlarında kullanılması gereken kumutlardır.
Kodlamaya devam
edersek;
| <FRAME
name="soltaraf"
target="sag_alt"
NORESIZE scrolling="no"
src="menu.html"> |
|
Soldaki frame'mimizin ismini
"Soltaraf" olarak belirlediğimiz görüyorsunuz.
Frame'lerimize isim vermek, Linklerimizde sayfaların hangi frame'de açılacağını
belirtmek içindir.
TARGET
parametresi ile linklerimizin
"sag_alt" isimli frame penceresine açılacağını göstermiş
olduk.
NORESIZE parametresi frame sınırlarımızın
mouse'la hareket ettirilemenesi içindir, Eğer site zıya retçiler iniz
tarafından kenarların hareket ettirilebilmesini istiyorsanız bu
parametreyi kullanmayın. Ama sol tarafta değişik arkaplanlar
kullanabileceğinizi göz önüne alarak tasarımın bozulmaması
için N0RESIZE komutunu kullanmanızı önerebiliriz.
SCROLLING parametresi kullanarak yanda kaydırma
çuıbuğunun çıkıp çıkmamasını belirtebilirsiniz.
Scrolling="yes" her zaman yanda
kaydırma çubuğunu çıkarır. Scrolling="no" sayfa aşağılara
kadar uzasa da kaydırma çubuğu çıkmayacaktır. Scrolling="auto" komutu ile de sayfa ekrandan uzunsa ancak kaydırma
çubuğu görüntülenir.
SRC parametresi ile de soldaki
frame'mimize hangi HTML dosyasının yükleneceğini belirlınektir. Bu
örneğimizde soldaki framemimiz " menü.html" dosyası
olacaktır.
Burada unutulmaması gereken
nokta ise frame sıralarıdır. Dikey frameler ise soldan sağa, yatay
frameler ise yukarıdan aşağıya konumlanırlar.
Şimdi sağdaki Frame'mimize geldi sıra.
Bu frame'mizi de ikiye ayıracaktık. Üstteki bölüme farklı bir HTML
sayfası gelecektir. Burada verilen linkler yine sağ alttaki
bölüme gitsin. Bunun için tekrar FRAMESET açmak gereklidir.
<fameset rows="65,'">
<frame name="sag_ust"
target="sag_alt"
scrolling="no"
src="ust.html"> <frame name="sag_alt"
scrolling="auto"
noresize src="alt.html">
</frameset>
|
Burada da dikkat ettiğiniz üzere
FRAMESET
içerisinde kullandığımız ROWS parametresi ile burada açtığımız
frame'in yatay iki pencereden oluştuğunu ve de üst frame'in
genişliğinin 65 piksel olduğunu belirttik.
Hemen altındaki FRAME komutları ile üst
taraftaki frame isminin sag_ust olduğunu ve ust.html adlı dosyayı
yüklemesini, alttaki framede ise yandaki kaydırma çubuğunun sayfanın
uzunluğuna göre ayarlanmasını belirttik.
Farkettiyseniz
</FRAMESET> komutu ile en son açtığımız FRAMESET'i kapatmış
olduk. Fakat ilk FRAMESET'imiz hala açık. Onu kapamadan önce tercihen
ekleyebileceğimiz bir iki komut daha bulunuyor.
<NOFRAMES> komtu bize, browserlarında
FRAME desteği olmayan veya bu özelliği kapatılmış olan ziyaretçiler
İçin ayrı bir bilgi veya ayrı bir sayfa kullanma olanağı veriyor.
|
<NOFRAMES>
<BODY>
<H1>FRAME Lİ
SAYFA</H1><BR>
Bu Sayfa Frame destekleyen browser'larda
görülebilmektedir.
</BODY>
</NOFRAMES> |
Yukandaki koddan da anlayabileceğiniz üzere
NOFRAMES komutları arasında tıpkı normal bir web sayfası gibi BODY
komutunu kullanabileceğiz. Tabii kapatmak kaydıyla.
Böylelikle FRAME desteği olmayan eski
browser kullanıcılarına, bu sayfanın FRAME'li bir sayfa olduğunu ve
de kullandığı browser'la bu sayfayı göremeyeceğine dair bir mesaj
vermiş olduk. Ve de son noktayı koyarsak
Böylelikle ana omurga sayfasını bitirmiş
olduk. Web üzerinde kullanılan belli başlı FRAME çeşitlerini ve HTML
kodlarını sıralarsak
Ana ve İçerik Menüsü
Üstteki ana menü bölümünden giden
linkler alt menüsü olan içerik menü bölümüne gider, içerikten ise
ana sayfaya yönlenir.
<frameset
rows="64,*"
framespacing="0"
frameborder="0"
border="0">
<frame name="anamenu"
scrolling="no"
noresize
target="icerikmenu"
src="banner.html">
<frameset cols="150,*"
framespacing="0"
frameborder="0"
border="0"><frame name"="icerikmenu"
target="anasayfa"
src="menu.html"><frame name="anasayfa"
src="anasayfa.html">
</frameset>
<noframes>
<body>
<H1>FRAMELİ SAYFA</H1><BR>
Bu Sayfa Frame destekleyen browserlarda
görülebilmektedir.
</body></noframes>
</frameset> |
|
Eklenme Tarihi: 07.11.2005 - 21:38 (İzlenme: 26437)
Dersi Yazdır / İndir
