2012-07-19 40 views
1

工作我发现这个职位jQuery的,用#标签

http://www.netmagazine.com/tutorials/create-jquery-tab-system

而且修改了这个标签,以适应我的当前设计。我唯一需要做的就是让这个标签插件和hashtags一起工作。例如,如果用户打开mydomain.com/#firstTab打开此选项卡。

我的代码看起来像

var url, tabToken; 
$(function() { 

    var indicator = $('#indicator'), 
    indicatorHalfWidth = indicator.width()/2, 
    lis = $('#tabs').children('li'); 

    $("#tabs").tabs("#content section", { 
     effect: 'fade', 
     fadeOutSpeed: 0, 
     fadeInSpeed: 400, 
     onBeforeClick: function(event, index) { 
      var li = lis.eq(index), 
      newPos = li.position().left + (li.width()/2) - indicatorHalfWidth; 
      indicator.stop(true).animate({ 
       left: newPos 
      }, 600, 'easeInOutExpo'); 
     } 
    }); 

}); 

$(document).ready(function() { 
    url = document.location.href; 
    tabToken=url_data = url.split('#')[1]; 
    if(tabToken){ 
     What to do??? 
    } 
}); 

请看看我发布的链接,并检查是否我可以使其与井号标签工作?我不想更改此插件,因为我找不到任何具有类似设计的插件。

回答

1

它看起来像你指的是使用jQuery tools tab system教程,

它已经有历史的选择与后退按钮支持沿

检查http://jquerytools.org/demos/tabs/history.html#tab3

$(function() { 
    $(".css-tabs:first").tabs(".css-panes:first > div", { history: true }); 
}); 

http://jquerytools.org/demos/tabs/history.html#tab1

http://jquerytools.org/demos/tabs/history.html#tab2

http://jquerytools.org/demos/tabs/history.html#tab3

而且检查这也是内联

http://jquerytools.org/demos/tabs/anchors.html

+0

我不需要历史))我需要hastag支持。像url#第一个 – heron 2012-07-19 00:43:57

+0

这不是我所需要的。我想通过带有#标签的url来制作活动标签 – heron 2012-07-19 00:56:28

+0

@epic_syntax你可以用历史记录来尝试:true,我对jQTools不太熟悉,但它看起来像打开历史记录也启用了散列标签。 – sabithpocker 2012-07-19 01:00:38