链接到另一个页面，执行函数，然后跳转到锚点

Question

我有两页。第一个有一个slideshow，它允许我为每张幻灯片添加链接。第二页有许多展开的 div，可以使用这个显示/隐藏功能展开/折叠 onclick：

 function showtxt(divID) {
   var item = document.getElementById(divID);
   if (item) {
     item.className=(item.className=='hidetxt')?'showtxt':'hidetxt';
   }
 }

然后该页面上的每个展开/折叠 div 都有自己的函数在点击时调用它：

function ANCHORbutton() { 
  var img = document.getElementById('expANCHORbutton').src;
  if (img.indexOf('plus.png')!=-1) { 
    document.getElementById('expANCHORbutton').src  = 'minus.png'; 
  }
  else { 
    document.getElementById('expANCHORbutton').src = 'plus.png'; 
  } 
}

如果可能的话，我想做的是将幻灯片中的每张幻灯片链接到第二页，展开相应的 div，然后将页面向下跳转到指定的锚点。

如果我没有将所有内容都折叠起来，那将是一个简单的href="http://domain.com/page2.html#ANCHOR"，但我正在努力解决如何在跳到我的锚点之前扩展适当的部分。

Answer 1

问题 1：折叠的 div 全部显示，因此无需浏览器滚动
问题 2：隐藏的 div 没有被滚动到，因为它们被隐藏了。

解决方案可能是页面底部的这个（在某些浏览器上重新加载时不会触发 onload）

<script>
var hash = location.hash;
if (hash) {
  var divID = hash.substring(1); // remove the #
  showtxt(divID);
  document.getElementById(divID).scrollIntoView();
}
</script>
</body>

更新添加100px：

var hash = location.hash;
if (hash) {
  var divID = hash.substring(1); // remove the #
  showtxt(divID);
  var div = document.getElementById(divID); 
  div.scrollIntoView(); 
  div.style.top=(parseInt(div.style.top,10)+100)+"px"; 
}