Выпадающий блок при клике на ссылку

jQ plugin

by Anton Polyakin

HTML

<h1>Выпадающий блок при клике на ссылку</h1>
<p style="width: 30em">
Стимулирование сбыта однородно ускоряет опрос, используя опыт предыдущих кампаний. Надо сказать, что комплексный анализ ситуации наиболее полно искажает
<a id="toggler" href="#" style="display:block; background:#eee;height:50px;">комплексный бренд</a>
, осознав маркетинг как часть производства. Потребление, как принято считать, вполне выполнимо. Правда, специалисты отмечают, что медийный канал по-прежнему устойчив к изменениям спроса.
</p>
<div id="drop-down-list" class="no-display drop-down-block" style="width: 20em">Блок с дополнительной интригующей, познавательной, необычайно полезной и своевременной инфомацией.</div>

CSS

.drop-down-block {
    background: none repeat scroll 0 0 #fff;
    border-color: #ebebeb #ccc #ccc #ebebeb;
    border-style: solid;
    border-width: 1px;
    padding: 0.3em;
}
.no-display {
    display: none;
}

JavaScript

// выпадающий список под ссылкой
(function($) {
    $.fn.dropDownBlock = function(block, options) {
        var defaults = {
            speed: 'fast',
            top: $(this).height(),
            left: 0
        },
        opts = $.extend(defaults, options),
        toggler = $(this),
        block = $(block);
        
        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();
        });
        $(document).on('click.fadeBlock', function(e){
        if($(e.target).closest('#toggler').length < 1 && $(e.target).closest('#drop-down-list').length < 1)
          block.fadeOut(opts['speed']);
        });
    };
})(jQuery); 
$('#toggler').dropDownBlock($('#drop-down-list'));