HTML点按钮网页定位到相应位置三步搞定

1、设置要点按钮，并添加onclick（）

<ul id="ul_menu" >
<li onclick="Redirect('1')">
    <a href="#">头部</a>
</li>
<li onclick="Redirect('2')">
   <a href="#">产品</a>
</li>
<li onclick="Redirect('3')">
    <a href="#">方案</a>
</li>
<li onclick="Redirect('4')">
    <a href="#">新闻</a>
</li>
</ul>

2、写上各模块位置div的id

<div id="div_info">
           <div class="index_info_title">头部内容</div>
           ......
</div>           

3、写上js事件

<script>
function Redirect(type) {
  var id = ""; //定位ID
  if (type == "1") {
      id = "#div_info"; //头部
  }
  else if (type == "2") {
      id = "#div_product"; //产品
  }
  else if (type == "3") {
      id = "#div_solution"; //方案
  }
  else if (type == "4") {
      id = "#div_news"; //新闻
  }
  if (id != "") {
      $("body,html").animate({ scrollTop: $(id).offset().top - 100 }, 500); //scroll top offset 指的是滚动条相对于其顶部的偏移        
  }
}
</script>