jquery colorbox tutorial

ColorBox is a very cool jQuery plugin. You can use it to open inline pages/images. its an perfect replacement for javascript's classic POP UP windows (window.open()).

Installing it and running it takes few minutes.

First Download it from http://www.jacklmoore.com/colorbox/

In your Download you need to copy these 3 files/folder....

images Directory

if you place css file and images directory within same folder then you dont need to change anything, however if you place images directory somewhere else, then you need to update your css file as well.

Also make sure your page has jQuery include on top of your page.

here is sample code.

<script type="text/javascript" src="/web/assets/js/jquery.1.8.3.js"></script>
<script src="/assets/js/colorbox/jquery.colorbox-min.js"></script>

<link rel="stylesheet" href="/assets/css/colorbox/colorbox.css" />

 function vDetailspopOut() {
      $.ajaxSetup({ cache: false });
        $(".vDetails_img").colorbox(); //apply on ALL CLASSES with name vDetails_img

 $(function(){ // onLOAD on document





<a href="item_detail.asp?sku=1 class="vDetails_img"><img src="/web/assets/images/button_quicklook_launcher_down.gif" border=1 /></a>








Posted by:

No comments posted.

Name :  

Email :  

Comment Below