Как обычно в начале подключаем:
<script type="text/javascript" src="jquery.js"></script><script type="text/javascript" src="jquery.disable.text.select.js"></script>Фича номер одинКлик по объекту плавно разворачивает какой-то блокТакой ефект будет полезен в списке частых вопросов, где при клике на вопрос открывает ответ на него. Сниппеты можно применить как к группе пар «ссылка-блок», так и к одной паре.// раскрытие блока при клике на ссылку(function($) { $.fn.openCloseBlocks = function(blocks, options) { var defaults = { speed: 'normal' }, opts = $.extend(defaults, options), togglers = $(this), bls = $(blocks); if(!bls) return; togglers.each(function(index) { $(this).click(function(e) { e.preventDefault(); $(bls[index]).slideToggle(opts['speed']); }); }); };})(jQuery);$('div > a').openCloseBlocks($('div.blocks'), { speed: 'fast'});HTML Код<h1>Раскрытие блока при клике на ссылку</h1><div><a href="#">Кликни по мне</a></div><div class="blocks no-display" style="width: 20em">Блок с дополнительной интригующей, познавательной, необычайно полезной и своевременной инфомацией.</div><br/><div><a href="#">Кликни по мне</a></div><div class="blocks no-display" style="width: 20em">Блок с дополнительной интригующей, познавательной, необычайно полезной и своевременной инфомацией.</div><br/><div><a href="#">Кликни по мне</a></div><div class="blocks no-display" style="width: 20em">Блок с дополнительной интригующей, познавательной, необычайно полезной и своевременной инфомацией.</div><br/><div><a href="#">Кликни по мне</a></div><div class="blocks no-display" style="width: 20em">Блок с дополнительной интригующей, познавательной, необычайно полезной и своевременной инфомацией.</div><br/><h1>Выпадающий блок при клике на ссылку</h1><p style="width: 30em">Стимулирование сбыта однородно ускоряет опрос, используя опыт предыдущих кампаний. Надо сказать, что комплексный анализ ситуации наиболее полно искажает <a href="#" id="toggler">комплексный бренд</a>, осознав маркетинг как часть производства. Потребление, как принято считать, вполне выполнимо. Правда, специалисты отмечают, что медийный канал по-прежнему устойчив к изменениям спроса.</p><div class="no-display drop-down-block" style="width: 20em" id="drop-down-list">Блок с дополнительной интригующей, познавательной, необычайно полезной и своевременной инфомацией.</div>Фича номер два)Клик по объекту показывает блок прямо под ней поверх контентаДругими словами выпадающее меню с каким либо содержанием.// выпадающий список под ссылкой(function($) { $.fn.dropDownBlock = function(block, options) { var defaults = { speed: 'fast', top: $(this).height(), left: 0 }, opts = $.extend(defaults, options), toggler = $(this), block = $(block); toggler.css({'outline': 'none'}) toggler.click(function(e) { e.preventDefault(); $(block).css({ 'position' : 'absolute', 'top' : (toggler.offset().top + opts['top']) + 'px', 'left' : (toggler.offset().left + opts['left']) + 'px' }); if($(block).is(':visible')) $(block).fadeOut(opts['speed']); else $(block).fadeIn(opts['speed']); this.focus(); }); toggler.blur(function() { $(block).fadeOut(opts['speed']); }); };})(jQuery);$('#toggler').dropDownBlock($('#drop-down-list'));HTML Код<h1>Выпадающий блок при клике на ссылку</h1><p style="width: 30em">Стимулирование сбыта однородно ускоряет опрос, используя опыт предыдущих кампаний. Надо сказать, что комплексный анализ ситуации наиболее полно искажает <a href="#" id="toggler">комплексный бренд</a>, осознав маркетинг как часть производства. Потребление, как принято считать, вполне выполнимо. Правда, специалисты отмечают, что медийный канал по-прежнему устойчив к изменениям спроса.</p><div class="no-display drop-down-block" style="width: 20em" id="drop-down-list">Блок с дополнительной интригующей, познавательной, необычайно полезной и своевременной инфомацией.</div>Внимание! У вас нет прав для просмотра скрытого текста.


