从另一个页面导航到 Bootstrap Accordion答案

【问题标题】：Navigate to Bootstrap Accordion from Another Page从另一个页面导航到 Bootstrap Accordion
【发布时间】：2014-01-21 20:34:06
【问题描述】：

我创建了一个包含多页内容的资源站点。每页有 20-30 个 Bootstrap 手风琴。单击时，手风琴展开以显示有关给定资源的其他信息。

我的目标是让主页具有“特色资源”，单击该资源将导航到页面并打开请求的手风琴。我想使用 # 来导航 (site.com/page.html#featured-resource)

以下脚本允许我使用主题标签导航到页面并打开请求的手风琴，但实际上并没有滚动到页面的该部分。

 $(document).ready(function () {
 location.hash && $(location.hash + '.collapse').collapse('show');
 });

我希望这不仅可以打开手风琴，还可以滚动到页面的该部分。我将如何做到这一点？

谢谢！

【问题讨论】：

检查jscrollpane.kelvinluck.com/scroll_to.html

标签： javascript jquery twitter-bootstrap accordion

【解决方案1】：

试试下面的

$(document).ready(function(){
  var posTop = $(location.hash + '.collapse').offset().top;
  $('html,body').animate({
      scrollTop: posTop - 20; //where 20 is allowance from top of the page
   });
});

【讨论】：

这应该只能从页面顶部向下滚动 20 像素，不是吗？这似乎并不特定于任何 div...
这将滚动到选择器location.hash + '.collapse'标识的div，这就是posTop变量的本质，20只是一个随机的容差值。
tlogbon - 啊，我明白了，谢谢。比尔 - 我没有尝试过，但它可能对你有用。让我们知道它是否达到了您的要求。

【解决方案2】：

比尔-

尝试使用jQuery的这个sn-p-->

//$( document ).ready(function() {

//location.hash && $(location.hash + '.collapse').collapse('show');

//Move the window's scrollTop to the offset position of the div named #now
$(window).scrollTop($('#now').offset().top);

//});

让我知道这是否适合您。干杯！

【讨论】：

这会起作用，但是是否可以让要滚动的元素由哈希值来定义？例如，如果哈希是#scroll-element，则有 $(window).scrollTop($('#scroll-element').offset().top);?
是的，这绝对有效，您只需将唯一的#ID 传递到下一页，以便该功能可以将用户滚动到页面上的正确位置。
我需要查看更多代码才能进一步帮助您。你有一些主页手风琴的示例代码和用户点击后会登陆的页面上的手风琴吗？