by admin

jquery Fancy Box

jquery Fancy Box

It is a tool for displaying images, HTML content and multi-media in a Mac-style “lightbox” that floats overtop of web page

Features

  1. Can display images, HTML elements, SWF movies, Iframes and also Ajax requests
  2. Customizable through settings and CSS
  3. Groups related items and adds navigation.
  4. If the mouse wheel plugin is included in the page then FancyBox will respond to mouse wheel events as well
  5. Support fancy transitions by using easing plugin
  6. Adds a nice drop shadow under the zoomed item

Steps to go with jquery Fancy box

Download the jquery fancy box latest package here 

1. Set the headers
The first thing to do is include the required files in the header of your page.
For the FancyBox, first the jQuery library, then the plugin script, and an additional stylesheet files.

  /* Include jQuery – try to use latest version */
    <script type=”text/javascript” src=”your_path_to/jquery.js”></script>

    /* jQuery fancybox plugin */
    <script type=”text/javascript” src=”your_path_to/jquery-fancybox.js”></script>

    /* Additional Style for fancybox */
    <link href=”your_path_to/fancybox.css” rel=”stylesheet” type=”text/css” />

2. Next step is to declare how and when the FancyBox will be displayed on your page.The below code tells that every link that has a class fancybox will have its content opened in a fancybox.
It can be added in the page header (as below) or in a separate (.js) file.

  <script type=”text/javascript”>

    $(document).ready(function(){
    $(“.fancybox”).fancybox();
    });

    </script>

3. Finally, you just need to create a link whose class will have to be fancybox (as you have declared in fancybox function) and whose href attribute will need to contain the path of the page/element you wish to open within the fancybox.

<a href=”page_target_path” class=”fancybox”>How’s it!!</a>

For demo click here

 

banner-side1

banner-side2

banner-side3

100% Guaranteed

100% Guaranteed

Our products and templates are developed with care to provide you upmost satisfaction and guarantee.

Our membership

Our membership

Our membership includes one or more plan which will fit your criteria.

100% secure payment

100% secure payment

We treat your payment and personal information with absolute security.

24x7 forum access

24x7 forum access

We provide 24/7 forum access for all products and template related queries.