Facebox Nedir?
Web Tasarım
Facebook‘taki gibi pencereler açtırmayı istiyorsanız, bu yazı tam size göre demektir. Bu yazımda Facebox‘ın ne işe yaradığından ve nereden bulabileceğinizden bahsedeceğiz. Bu script’i kullanarak Resimlerinizi veya içeriklerinizi Klasik Pop-up pencere içinde açmak yerine varsayılan sayfa içinde açıp kullanabilirsiniz. Javascript-Ajax nimetlerinden biri olan bu script’in nasıl kurulacağını anlatarak konumuza giriş yapalım.
Kurulum
Kuruluma geçmeden önce aşağıdaki dosyaları Facebox‘un sitesinden veya aşağıdan indirin. Facebox sitesinde Tar dosyası olarak sunulduğu için Dynamic Drive‘daki dosyaları kullanmak daha uygun olur diye düşündüm. Aşağıdaki dosyaları oradan verdim. Kurulum için gerekli dosyalar; Facebox1.1.zip
Zip dosyasının içinden facebox.js, facebox.css, jquery-1.2.2.pack ve facebox içinde kullanılacak resim dosyaları çıkmış olmalı. facefiles klasörü içinde bulunan dosyaları sitenizde kullanmak istediğiniz yere koyun. Eğer bu script’i bir Wordpress Teması içinde kullanacaksanız aşağıda yazan dosyalarinbulunacagiklasor yerine <?php bloginfo(’template_directory’); ?> yazın (Bu kodla sitenizinadı.com/wp-content/themes/kullandığınıztema içine girmenizi sağlayacaktır.) ve facefiles klasörünü doğrudan temanızın içine yerleştirin. Aşağıda gördüğünüz kodlarıysa sitenizde yada temanızda bulunan <head> </head> kısmının arasında bir yere gerekli değişiklikleri yaparak kopyalayın. Wordpress’te temadaki Header.php içinde ilgili yere kopyalayın.
<script src="dosyalarinbulunacagiklasor/facefiles/jquery-1.2.2.pack.js" type="text/javascript"></script> <link href="dosyalarinbulunacagiklasor/facefiles/facebox.css" media="screen" rel="stylesheet" type="text/css" /> <script src="dosyalarinbulunacagiklasor/facefiles/facebox.js" type="text/javascript"></script> <script type="text/javascript"> jQuery(document).ready(function($) { $('a[rel*=facebox]').facebox() }) </script>
Yukarıda yazılanları yapıp dosyaları ilgili yere atmışsanız. Kurulum işleri tamamlanmış demektir. Şimdi gelelim nasıl kullanacağımıza.
Nasıl kullanılır?
En basit halde linklerinizin içine rel=”facebox” ekleyerek kullanabilirsiniz. Aşağıda benzer bir kullanımını örnek olmak açısından verdim. Daha fazla bilgi için Dynamic Drive‘daki ilgili yeri veya Facebox sitesini gözatmanızı tavsiye ederim.
<p><a href="resim.jpg" rel="facebox">Resim</a></p>
Gördüğünüz gibi Facebox’ın benzer kullanımları da bu şekilde yapılmakta. Bu script’le ilgili daha fazla bilgiyi aşağıdaki linklerden alabilirsiniz. Şimdilik hoşçakalın.
http://www.dynamicdrive.com/dynamicindex4/facebox/index.htm
- Hellgate London Free2Play Oluyor !
- 10. Avrupa Cable Wakeboard (kablolu su kayağı) Şampiyonası – Sukaypark / Bursa
- Bush’a Ayakkabı yada Birşeyler Fırlatmak Modası
- Facebook Sıkça Sorulan Sorular 2
- Trukz - Bir Kamyon Simulasyonu
- Mini Cooper Foto Galeri
- Kurban Bayramımız Kutlu Olsun
- Photoshop Yapmak
- Çok kullanışlı Kupa ile Sabah Kahvenizi yada Çayınızı içerken Plan Yapın
- Frp Dersleri DnD V3.5 - Bolum 5 - Statlar
Loading ...
Bu Konuya 2 Yorum Yazıldı
Bu yorum 23 Kasım 2008, 13:11 yazıldı
Paylaşımınız için teşekkürler.
Bu yorum 09 Şubat 2009, 20:24 yazıldı
merhebe. bence cok güzel bir paylasım. paylasım için tesekkuurler.