Webscripts.pl - darmowe skrypty na Twoją stronę. » colorbox http://www.webscripts.pl Tue, 20 Apr 2010 20:51:10 +0000 en hourly 1 Colorbox – plugin `lightbox` dla jQuery http://www.webscripts.pl/colorbox/ http://www.webscripts.pl/colorbox/#comments Wed, 27 Jan 2010 15:49:27 +0000 b4x http://www.webscripts.pl/?p=33 Colorbox – jest to plugin przydatny do prezentacji obrazków / zdjęć w galeriach – umożliwia on po kliknięciu w miniaturkę wyświetlenie eleganckiego okienka z pełnym rozmiarem zdjęcia.

Dodatkowymi zaletami Colorboxa, jest możliwość wstawienia filmów z Youtube oraz Vimeo, umożliwia nam także wyświetlenie zewnętrznej strony (iframe) oraz własnego kodu HTML.

Przykładowe działania Colorboxa ‘na żywo’ można obejrzeć na stronie autora (kliknij by obejrzeć demo).

Przykładowy efekt – video z Youtube’a

na naszej stronie – także został zastosowany Colorobx – po kliknięciu na obrazek, także obejrzymy efekt.

Instalacja Colorobxa, jest także prosta,  w <head> należy dodać bibliotekę jQuery oraz plugin colorboxa:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="../colorbox/jquery.colorbox.js"></script>
<script type="text/javascript">
 $(document).ready(function(){
 $("a[rel='colorbox']").colorbox();
 });
</script>

Później należy przy obrazkach, linkach itp. dodać do odnośnika parametr rel=”colorbox” np:

<a href="http://www.webscripts.pl" rel="colorbox">Webscripts.pl - Colorbox</a>

Taki przykład wyświetli nam stronę Webscripts.pl za pomocą colorboxa.

Zaawansowane możliwości, oraz ich zastosowanie wraz przykładami można obejrzeć na stronie autora.

]]> http://www.webscripts.pl/colorbox/feed/ 0