Question

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

 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"; 
}

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

1 个答案: