Ayrıntılı Konu Bilgileri
Sayfa BaşlığıKonu: ÇERÇEVELER (FRAME) Yapmak
Mesaj SayısıMesaj Sayısı: 0 cevap var
OkumaGösterim: 1239
Google Özel Arama

Gönderen Konu: ÇERÇEVELER (FRAME) Yapmak  (Okunma sayısı 1239 defa)

0 Üye ve 1 Ziyaretçi konuyu incelemekte.

    sevdaligul

  • Administrator
  • *

  • İleti: 13121
  • Nerden: Konya
  • Rep: +6511/-0
  • Cinsiyet: Bay
  • GüLe SeVDaLı Bir GeNç
    • MSN Messenger - sevdaligul@gmail.com
    • Profili Görüntüle GüLe SeVDaLı BiR GeNçLiK
  • Çevrimdışı
ÇERÇEVELER (FRAME) Yapmak
« : 13 Mayıs 2007, 09:02:59 »


 
Çerçeve tekniği, bir web sayfasını istenilen miktarda parçaya bölüp, bu sayfa üzerinde birkaç sayfa birden görüntülenmesine olanak verir. Bu tekniğin en çok kullanılan varyasyonu, sayfanın sol veya üst kısmından küçük bir alanı bölmek (yani sayfayı ikiye bölmek), bu küçük alana menü bilgilerini, diğer büyük alana ise sayfanın asıl içeriğini yerleştirmektir.
Fakat şunu da belirtmekte fayda var, birçok tasarımcı estetik açısından çerçevelere pek sıcak bakmaz; genelde üst üste tablolar kullanmayı tercih eder. Yine de pek sık kullanılmayan bu tekniği aklınızın bir yerinde tutun, belki faydalı olabilir...
Bir uyarı: Netscape 2.0 ve Explorer 3.0 altı browser'lar, çerçeveleri tanımazlar!

ÇERÇEVE TEKNİĞİNİN GENEL MANTIĞI
Çerçeve tekniğinde, ilk önce parent(ana) frame denilen bir sayfa oluşturmak gerekir. <Frameset>... </frameset> etiketlerinin parametreleri olan cols ve rows ifadeleri ile sayfayı dikey ve yatay olarak ne oranda bölmek istediğimizi browser'a bildiririz. Src parametresi ile ana çerçevenin bölümlerinde görüntülenecek sayfaların adreslerini bildirdikten sonra, geriye biraz önce adreslerini bildirdiğimiz sayfaları uygun bir şekilde hazırlamak kalır. Şimdi bu biraz karışık ifadeyi bir örnekle daha iyi anlayalım, sonra da <frameset> etiketini inceleyelim.
Önce ana pencereyi hazırlayalım:
<html>< BR><head>
<title>Çerçeveörneği</title>
<METAcontent=text/html;CHARSET=iso-8859-9 http-equiv=Content-Type
</head>
<frameset cols="150,*">
<frame name="menu" src="menu.html">
<frame name="esas" src="esas.html">
</frameset>
<noframes>
<body>
<h1>Browser'ınızın sürümü sayfamızı görüntülemeye uygun degil, lütfen daha yeni bir sürüm
yükleyip tekrar deneyin!</h1>
</body>
</noframes>
</html>

Burada yaptığımız şey ana sayfayı soldan 150 piksel genişliğinde bölüp iki sayfa elde etmekten ibaret. Ayrıca browser'a soldan ilk bölüme (150 px olan bölüm) 'menu.html', ikinci bölüme ise 'esas.html' sayfalarını yerleştirmesini bildirdik. Burada dikkat edilmesi gereken nokta <frameset> etiketinin </head> ile <body> etiketleri arasına yerleştirilmesidir. <Noframes>...</noframes> etiketleri içinde yer alan bölüm ise çerçeveden anlamayan eski sürüm browser'lar içindir. Şimdi aşağıdaki kodlardan ilkini 'menu.html', ikincisini ise 'esas.html' adıyla ana pencereyi kaydettiğiniz dizine kaydedin.

<html>
<head>
<title>menu</title>
<METAcontent=text/html;CHARSET=iso-8859-9 http-equiv=Content-Type>

</head>
<body bgcolor="teal">
</body>
</html>

<html>
<head>
<title>esas</title>
<METAcontent=text/html;CHARSET=iso-8859-9 http-equiv=Content-Type>
</head>

<body bgcolor="Red"></body>
</body>
</html>
Son olarak tekrar ana sayfayı açtığınızda (ismi önemli değil, yeter ki diğer iki sayfa ile aynı dizinde bulunsun!) sonuç böyle olacaktır:

Artık çerçevelerin mantığını anladığımıza göre bu tekniğin detaylarını inceleyelim...


11/2. <FRAMESET> ve <FRAME> ETİKETLERİ

Aşağıda <frameset> etiketinin parametrelerini görüyorsunuz :
rows
Safayı enine bölmenizi sağlar
<frameset rows="150,*">
<frame name="menu" src="menu.html">
<frame name="esas" src="esas.html">
</frameset>

cols
Sayfayı boyuna bölmenizi sağlar
<frameset cols="150,*">
<frame name="menu" src="menu.html">
<frame name="esas" src="esas.html">
</frameset>

cols ve rows parametreleri piksel değeri alabilecekleri gibi '%' cinsinden de değer alabilirler, örneğin:
<frameset cols="%20,%80">
Daha önce kullandığımız '*' ifadesi ile bölünecek alanın genişliğini browser'a bırakabiliriz:
<frameset cols="%20,*">
Son olarak sayfayı üçe veya daha fazlaya da böşebiliriz:
<frameset rows="150,200,100,*"> ifadesi ile ana pencereyi dörde böleriz.
frameborder
Ana sayfanın bölümleri arasında sınır çizgisi olup olmamasısını belirler.('yes', 'no'; veya '1', '0' değerlerini alır)
<frameset cols="150,*" frameborder="1">
<frame name="menu" src="menu.html">
<frame name="esas" src="esas.html">
</frameset>

border
Çerçeveler arasındaki sınırın kalınlığını piksel cinsinden belirler.
<frameset cols="150,*" border="10">
<frame name="menu" src="menu.html">
<frame name="esas" src="esas.html">
</frameset>


Şimdi de <frame>; etiketinin parametreleri:

src
Bunu zaten biliyorsunuz, çerçeve içinde görüntülenecek sayfanın yeri
marginwidth
Sayfanın solundaki kenar boşluğunu belirtir
marginheight
Sayfanın üstündeki kenar boşluğunu belirtir
noresize
'1' veya '0' değerlerini alır, '1' verilirse pencere boyutları sabitlenir.
scrolling
'yes', 'no', 'auto' değerlerini alır, kaydırma çubuklarının durumunu belirler.

11/3. FRAME UYGULAMALARI
Aşağıda bazı çerçeve örnekleri ve bu örneklerin kodları verilmiştir:


<frameset rows="150,*" cols="150,*" >
<frame name="kirmizi" src="kirmizi.html">
<frame name="yesil" src="yesil.html">
<frame name="sari" src="sari.html">
<frame name="siyah" src="siyah.html">
</frameset>

<frameset rows="150,*">
<frame name="kirmizi" src="kirmizi.html">
<frameset cols="30%,*">
<frame name="yesil" src="yesil.html">
<frame name="sari" src="sari.html">
</frameset>

<frameset rows="150,*">
<frameset cols="*,*">
<frame name="kirmizi" src="kirmizi.html">
<frame name="yesil" src="yesil.html">
</frameset>
<frame name="sari" src="sari.html">
</frameset>

<frameset cols="150,*">
<frameset rows="*,*,*">
<frame name="yesil" src="yesil.html">
<frame name="kirmizi" src="kirmizi.html">
<frame name="sari" src="sari.html">
</frameset>
<frame name="siyah" src="siyah.html">
</frameset>
Çerçevelerle çalışmaya başlamadan önce bilmeniz gereken önemli bir nokta:
Hatırlarsanız bağlantılar konusunda <a> etiketinin target isimli bir parametresi olduğundan ve bu parametrenin 'Çerçeveadı' değerini alabileceğinden bahsetmiştik. Bu parametre bize bağlantının belirttiği adresdeki sayfanın adını verdiğimiz çerçeve içinde açılmasını sağlar. Örneğin bu sayfadaki ikinci örneği ele alalım:
'İstiyoruz ki sayfanın yeşil bölümü sayfamızın menüsü olsun. Ziyaretçi buradaki bağlantılara tıklayarak sitenin diğer sayfalarına ulaşsın, ama bu diğer sayfalar sarı bölümde görüntülensin.'
İşte aşağıdaki kod bunu sağlar:
<a href="Linklerin Görülmesine İzin Verilmiyor. Üye Ol ya da Giriş Yapsecenek1.html target="sari">Bu link saril bölümde görüntülenecek!</a>
Gördüğünüz gibi çerçevelere verdiğimiz isimler (name) bu noktada önem kazanıyorlar
Aklımdaki sensin
Fikrimdeki Sen
Sen tekderdimsin
Gülüm Benim


Paylaş delicious Paylaş digg Paylaş facebook Paylaş furl Paylaş linkedin Paylaş myspace Paylaş reddit Paylaş stumble Paylaş technorati Paylaş twitter
 

Benzer Konular

  Konu / Başlatan Yanıt Son İleti
0 Yanıt
327 Gösterim
Son İleti 30 Eylül 2012, 01:09:44
Gönderen: dj_ibo_g_h
0 Yanıt
266 Gösterim
Son İleti 27 Haziran 2013, 22:57:20
Gönderen: Hayat22
0 Yanıt
240 Gösterim
Son İleti 23 Temmuz 2013, 18:02:56
Gönderen: berkan26
0 Yanıt
366 Gösterim
Son İleti 23 Temmuz 2013, 18:09:25
Gönderen: berkan26
0 Yanıt
193 Gösterim
Son İleti 17 Aralık 2014, 08:49:28
Gönderen: Birikim Gayrimenkul

web hosting Domain Web
İçerik sağlayacı paylaşım sitelerinden biri olan sevdaligul.com forum sitemizde 5651 Sayılı Kanun’un 8. Maddesine ve T.C.K’nın 125. Maddesine göre TÜM ÜYELERİMİZ yaptıkları paylaşımlardan sorumludur. sevdaligul.com hakkında yapılacak tüm hukuksal Şikayetler sevdaligul@gmail.com  adresi ile iletişime geçilmesi halinde ilgili kanunlar ve yönetmelikler çerçevesinde en geç 1 (Bir) Hafta içerisinde sevdaligul.com  yönetimi olarak tarafımızdan gereken işlemler yapılacak ve size dönüş yapacaktır.