title: Working with Lightbox Jquery plugin
body: <p>I have designed a web page where  on the left there is a div element and in the center there is iframe and on the right I have another iframe.</p>
  
  <p>1.In the center iframe I load thumbnail images on clicking those images the lightbox plugin is get called and larger images has to be displayed on entire document(with blurred background).</p>
  
  <p>2.Problem I'm facing is that the lightbox plug-in is loading inside the center iframe rather than in the entire document(as in many of social networking sites).</p>
  
  <p>3.I have downloaded lightbox plugin from internet and using it in my webpage</p>
  
  <p>4.I want the image to be displayed in entire document with the help of lightbox .</p>
  
  <p>Any help is greatly appreciated</p>
  
  <p>here is the code snippet which I have written</p>
  
  <pre><code>&lt;!--this code is written in home page--&gt;
  &lt;div&gt;
  &lt;ul&gt;
          &lt;li&gt;&lt;a href="http://localhost/php/image.php?category=sea" target="description" class="underline"&gt;SEA&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="http://localhost/php/image.php?category=ANIMALS" target="description" class="underline"&gt;ANIMALS &amp;amp; BIRDS&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="http://localhost/php/image.php?category=plants" target="description" class="underline"&gt;plants&lt;/a&gt;&lt;/li&gt;
       &lt;li&gt;&lt;a href="http://localhost/php/image.php?category=Tourism" target="description" class="underline"&gt;Tourism&lt;/a&gt;&lt;/li&gt;
  &lt;ul&gt;
  &lt;/div&gt; 
  &lt;filedset&gt;&lt;iframe name="description" width="725px" height="800px" align="left" frameborder="0" id="description"&gt;&lt;/iframe&gt;&lt;/fieldset&gt;
  &lt;fieldset&gt;
  &lt;iframe name="info" width="300px" height="380px" frameborder="0" src="UserInformation.php" id="iframeid"&gt;&lt;!--logged in user's information--&gt;
  &lt;/iframe&gt;
  &lt;/fieldset&gt;
  &lt;!--this code is written in image.php file--&gt;
  &lt;head&gt;
  //calling JQUERY LIGHT BOX PLUGIN HERE ON clicking an image displayed in this page(within iframe name="description")
  &lt;script type="text/javascript" src="../js/jquery.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="../js/jquery.lightbox-0.5.js"&gt;&lt;/script&gt;
  &lt;link rel="stylesheet" type="text/css" href="../css/jquery.lightbox-0.5.css" media="screen" /&gt;
  &lt;script type="text/javascript"&gt;
      $(function() {
          $('#gallery a').lightBox();
      });
      &lt;/script&gt;
  &lt;/head&gt;
  </code></pre>
  
  <p>Thanks.</p>