How to add Pretty Photo Powerful jQuery Lightbox Plugin

Add Tool

Add Pretty Photo Powerful jQuery Lightbox Plugin


Add Pretty Photo Powerful jQuery Lightbox Plugin

Pretty Photo is a powerful jQuery Lightbox Plugin. Not only does it support images, it also support for videos, flash, YouTube, iframes and ajax contents. It’s a full blown media lightbox. It also can be used as an awesome slideshow for your images.

How to install Pretty Photo Lightbox

1. Download  Powerful jQuery Lightbox Plugin from the above Download Link

2. Uncompress the installation zip file into the root of the website that will be using prettyPhoto.

<script src="/prettyPhoto/js/jquery-1.6.1.min.js" type="text/javascript"></script>
<link rel="stylesheet" href="/prettyPhoto/css/prettyPhoto.css" type="text/css" media="screen" title="prettyPhoto main stylesheet" charset="utf-8" />
<script src="/prettyPhoto/js/jquery.prettyPhoto.js" type="text/javascript" charset="utf-8"></script>

3.In the body of the document, the following attribute needs to be added to the href of the a element that will be calling the script.

rel="prettyPhoto[iframe]"

For Example

<a href="your-image-url.jpg" rel="prettyPhoto[iframe]"><img src="your-image-url.jpg" alt="Your altra tag will goes here" width="186" height="139" border="0" /></a>

4. This last piece of code is what makes all the magic happen. Include the following JavaScript before closing your headtag.

<script type="text/javascript" charset="utf-8">
  $(document).ready(function(){
    $("a[rel^='prettyPhoto']").prettyPhoto();
  });
 
  function prettyLaunch(linkurl, title) {
     document.getElementById("prettyLink").href = linkurl;
     document.getElementById("prettyLink").title = title;
 
     $.prettyPhoto.open(linkurl+'?iframe=true&amp;width=100%&amp;height=100%',title);
  }
</script>

Congratulation Now you know How to Install prettyPhoto JavaScript Lightbox in a website. Don't forget to share it with with your friends. Thank you.


Tags: jquery pretty photo light box, pretty photo jquery light box plugin, pretty light box jquery, jquery media light box, light box video jquery, jquery light box youtube player
Payza

About Masum Billah

Add Pretty Photo Powerful jQuery Lightbox Plugin 1stWebSuite website seo tool is a free website ranking tool site provides a lot of on page and off page seo useful tools for you. On this site, we have a large number of website ranking tools


SIGN UP TO GET UPDATE TO YOUR INBOX




Discuss about: How to add Pretty Photo Powerful jQuery Lightbox Plugin


adf.ly