OyunlarBilecik

PrettyPhoto Lightbox

Pretty-Photo Lightbox Uygulaması

Bu site oyunlarbilecik.tr.gg'nin alt sitesidir. Lightbox uygulamasını yapamayanlar için bu paylaşım yapılmıştır. Bir çok kişinin bu uygulamadan yararlanıcağına inanıyorum. Şimdi size kısa yoldan ve kolay bir anlatım sunacağım.

Bs giriş yaptıktan sonra; Tasarım Ayarları -> Gelişmiş Ayarlar -> İçerik Bölümü Altındaki Bilgi yerine aşağıdaki kodu yapıştırıyoruz.

İçerik Bölümü Altındaki Bilgi Yerine Eklenecek Kod:


	<script type="text/javascript" src="http://HypeRxX.opendrive.com/files/NV8xNjY1NjA1X0p0eEhM/jquery-1.4.4.min.js"></script> <link rel="stylesheet" href="http://HypeRxX.opendrive.com/files/NV85NzM4MjQwX2piZERz/prettyPhoto.css" type="text/css" media="screen" charset="utf-8" /> <script src="http://HypeRxX.opendrive.com/files/NV8xNjY1NjA2X3hpTG9O/jquery.prettyPhoto.js" type="text/javascript" charset="utf-8"></script> <script type="text/javascript" charset="utf-8"> $(document).ready(function(){ $("a[rel^='prettyPhoto']").prettyPhoto({animationSpeed:'slow',theme:'facebook'}); });</script>

-- Lightbox ile Eklenebilecekler --
-> Resimler (gif,png)
-> Site arayüzü gösterme
-> Video,swf,flash uygulamaları

Yukarıdaki seçtiğiniz gruba göre aşağıdaki kodları istediğiniz sayfaya ekliyeceksiniz. Şimdide lightbox paylaşım kodlarına geçelim.

Resim (gif,png)

Tekli Resim Gösterme: Resimleri tek tek büyüterek bakmak içindir.


	<a rel="prettyPhoto" href="Tıklanınca Gösterilcek Büyük Resim Url"><img src="Tıklanması İçin Gösterilcek Küçük Resim" alt="" width="60" height="60" border="0" /></a>

Çoklu Resim Gösterme: Resimleri galeri biçiminde art arta göstermek içindir. Burada aynı galeri ismini vermeye dikkat edin. (Ben "oyunlarbilecik" verdim) Galeri olarak ok yardımıyla bir sonraki resme geçebilirsiniz.


	<a rel="prettyPhoto[oyunlarbilecik]" href="Tıklanınca Gösterilcek Büyük Resim Url"><img src="Tıklanması İçin Gösterilcek Küçük Resim" alt="" width="60" height="60" border="0" /></a> <a rel="prettyPhoto[oyunlarbilecik]" href="Tıklanınca Gösterilcek Büyük Resim Url"><img src="Tıklanması İçin Gösterilcek Küçük Resim" alt="" width="60" height="60" border="0" /></a> <a rel="prettyPhoto[oyunlarbilecik]" href="Tıklanınca Gösterilcek Büyük Resim Url"><img src="Tıklanması İçin Gösterilcek Küçük Resim" alt="" width="60" height="60" border="0" /></a>

Site Arayüzü Gösterme (İframe)

Siteleri lightbox penceresinde göstermek istiyorsanız kullanabilirsiniz.

OyunlarBilecik - Google - Bedava-Sitem


	<a href="Göstereceginiz Site Url?iframe=true&width=100%&height=100%" rel="prettyPhoto">Site İsmi İsterseniz Resim Url </a>

Video,swf,flash Uygulamaları

Video Gösterme: Lightbox üzerinde video oynatmak istiyorsanız.


	<a rel="prettyPhoto" href="Video Url'si Buraya?width=600&height=450"><img src="Resim Buraya" alt="" width="85" height="55" border="0" />

Swf Gösterme: Lightbox üzerinde swf, oyun oynatmak istiyorsanız.


	<a rel="prettyPhoto" href="Flash Url'si Buraya?width=600&height=450"><img src="Resim Buraya" alt="" width="85" height="55" border="0" />

İsteyen arkadaşlar lightbox'un şeklini değiştirebilirler. Yapmanız gereken şey ise; "İçerik bölümü altındaki bilgi" yerine eklediğimiz alttaki kodda. Facebook yazan yazıyı alttaki seçeneklerden biriyle değiştirmektir.


	$(document).ready(function(){ $("a[rel^='prettyPhoto']").prettyPhoto({animationSpeed:'slow',theme:'facebook'}); });

Facebook yerine eklenebilecekler;
light_square
light_rounded
facebook
dark_square
dark_rounded

Yukarıdaki seçeneklerin herbiri farklı görüntü ve özelliklere sahiptirler. Biz sadece 1 şekilde gösterdik ama siz diğerlerinide uygulayarak bakabilirsiniz. Anlatım burada son bulmuş oluyor. Elimden geldiğince anlatmaya çalıştım umarım işinize yarar.

Not: Konu hiçbir şekilde alıntı yapılamaz veya başka bir sitede paylaşılamaz. Tamamen kullanım amaçlı paylaşımdır ve Oyunlarbilecik.tr.gg' tarafından düzenlenmiştir.

PrettyPhoto Lightbox

Pretty-Photo Lightbox Uygulaması