Увеличение объектов через плагин Fancy Zoom на jQuery
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
<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> |
2#: Следующие коды в любое нужное место: 1) Для картинок:
|
1 2 3 4 5 6 7 8 9 10 |
<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> |
|
1 2 3 4 5 6 7 8 9 10 11 12 |
<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> |
|
1 2 3 4 5 6 |
<a href="#flash_box" id="flash_box_link">Ссылка для блока с флеш контентом</a> <div id="text"> <div id="flash_box"> Здесь любой флеш контент </div> </div> |
Автор публикации
Я не понял вашего вопроса, но постараюсь на него ответить...
