Я использую JQuery UI для создания вкладок в своем приложении. Мне нужно, чтобы вкладки были ссылочными (прямая ссылка, которая открывает страницу и выбирает нужную вкладку). Для этого используется хэш-тег/фрагментированный идентификатор. Но у меня возникла проблема, когда содержимое над вкладками и внутри вкладок очень длинное.
При нажатии на вкладки страница прокручивается вниз до начала вкладки. Это не то, чего я хочу.
Я использую Jquery 1.7.1 и Jquery UI 1.8.16.
Код javascript/Jquery - это стандартный Jquery UI tabs с добавлением события "tabsshow". Это предлагается в Changing location.hash with jquery ui tabs (вопрос на Stackoverflow) и JQuery UI Tabs: Updating URL with hash while clicking the tab (блог - Tech Diary by Robin)
$(document).ready(function() {
$("#tabs").tabs();
/**
* Add hash to URL of the current page
*
* http://chwang.blogspot.com/2010/02/jquery-ui-tabs-updating-url-with-hash.html
* https://stackoverflow.com/questions/570276/changing-location-hash-with-jquery-ui-tabs
*/
$("#tabs").bind('tabsshow',function(event, ui) {
window.location.hash = ui.tab.hash;
});
});
Для проверки поведения можно использовать следующий HTML
Some other content
При открытии страницы со следующим URL должна быть открыта вкладка 1, а не прокрутка вниз до начала вкладки. То же самое относится и к щелчку на одной из вкладок.
file.html#tab_1