<link rel="stylesheet" href="/css/common.css" type="text/css" />  
  <script type="text/javascript" src="/js/fancyzoom.min.js"></script>  
  <script type="text/javascript" charset="utf-8">  
  $(document).ready(function() {  
  $('div.photo a').fancyZoom({scaleImg: true, closeOnClick: true});  
  $('#medium_box_link').fancyZoom({width:400, height:300});  
  $('#large_box_link').fancyZoom();  
  $('#flash_box_link').fancyZoom();  
  });  
  </script>  
   
  <style type="text/css" media="screen">  
  #large_box {width:800; height:600;}  
  </style>

<div id="photos">  
  <div class="photo">  
  <a href="#image1">  
  <img src="http://farm4.static.flickr.com/3250/2765022017_356efe6a25_s.jpg" alt="Github helmet" />  
  </a>  
  </div>  
  <div id="image1">  
  <img src="http://farm4.static.flickr.com/3250/2765022017_356efe6a25.jpg" alt="helmet" />  
  </div>  
  </div>

<a href="#medium_box" id="medium_box_link">Ссылка для среднего блока</a>  
  <div id="text">  
  <div id="medium_box">  
  Здесь любой ваш текст в среднем блоке  
  </div>  
  </div>  

  <a href="#large_box" id="large_box_link">Ссылка для большого блока</a>  
  <div id="text">  
  <div id="large_box">  
  Здесь любой ваш текст в большом блоке блоке  
  </div>  
  </div>

<a href="#flash_box" id="flash_box_link">Ссылка для блока с флеш контентом</a>  
  <div id="text">  
  <div id="flash_box">  
  Здесь любой флеш контент  
  </div>  
  </div>