Я использую этот код jquery, чтобы показать подсказку для ссылок на моей главной странице. Всплывающая подсказка отображается ниже кнопки ссылки, и проблема в том, что пользователь быстро перемещается, меню исчезает. Поэтому каждый раз они должны медленно спускаться.
И есть ли способ показать всплывающую подсказку в верхней части кнопки ссылки, чтобы пользователь мог быстро перемещаться вниз, без исчезновения элементов меню.
Код:
<link rel="stylesheet" href="/jquery- ui.css" />
<script src="/jquery-1.9.1.js"></script>
<script src="/jquery-ui.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$(document).tooltip();
});
</script>
<style type="text/css">
div.ui-tooltip
{
max-width: 100%;
font-size: 14px;
}
</style>
HTML:
<li><a href="#" class="pureCssMenui">Department</a>
<ul class="pureCssMenum">
<li class="pureCssMenui"><a class="pureCssMenui" href="Manufacturer.aspx" title="Contains list of Manufacturers">
Manufacturer</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="Food & Beverages.aspx" title="Has informations on foods type manufacturing">
Food & Beverage</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="Transport.aspx" title="Has transport cost across globe">
Transportation</a></li>
</ul>
</li>
Добавьте параметр options в свою подсказку().
$(document).tooltip({ position: { my: "bottom", at: "top" } });
Справочный интерфейс jQuery:
<script type="text/javascript" src="/jquery-ui.min.js"></script>
Здесь код JSFiddle: http://jsfiddle.net/2gLm5/4/
Если ваш браузер несовместим, просто используйте стороннюю библиотеку, такую как Bootstrap