WOAHBar - jQuery скрипт всплывающей информационной панели |
|
08 Сентября 2013 24920 |
WOAHBar — скрипт всплывающей информационной панели, на которой можно разместить, например, акцию, важную или срочную информацию, рекламное предложение, блок социальных кнопок или ссылку подписки на рассылку.
WOAHBar — это бесплатная альтернатива многофункционального скрипта HelloBar.
1. Подключаем библиотеки jQuery, jQuery UI, функцию скрипта WOAHBar и стили CSS.
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js" type="text/javascript"></script>
<script src="woah-script.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="woahbar.css" />
Cкрипт WOAHBar был улучшен (Mark Dixon) — добавлена поддержка cookies. После того как посетители сворачивают WOAHbar, он остается закрытым, пока они не решат его открыть снова или не наступает окончание срока cookies.
2. Загружаем на сайт изображения woahbar-up-arrow.png, woahbar-up-arrow-hover.png и woahbar-down-arrow.png и не забываем прописать их месторасположение в коде.
3. Вставляем код.
<span>Какой-то информационный текст <a class="woahbar-link" href="ссылка">Текст ссылки</a></span>
<a title="скрыть панель" class="close-notify" onclick="woahbar_hide();"<img class="woahbar-up-arrow" src="woahbar-up-arrow.png"></a>
</div>
<div class="woahbar-stub" style="display:none">
<a title="открыть панель" class="show-notify" onclick="woahbar_show();"><img class="woahbar-down-arrow" src="woahbar-down-arrow.png"></a>
</div>