javascriptページ内移動。指定したアンカー名への移動方法。

◆window.location.hashを使用した移動

移動先となる場所に、<a name=”アンカー名”></a>を設置し、以下javascriptを記述。

<script type="text/javascript">
window.location.hash = "アンカー名"
</script>

window.location.hash = "アンカー名"

</script>

◆jqueryを使用した移動

<script type="text/javascript">
$(function(){
   //a hrefをクリック際の処理を例に。
   $('a[href^=#]').click(function() {
      // スクロール速度(ミリ秒)
      var speed = 100;
      // アンカーの値取得
      var href= $(this).attr("href");
      // 移動先を取得
      var target = $(href == "#" || href == "" ? 'html' : href);
      var position = target.offset().top;
      // 移動
      $('body,html').animate({scrollTop:position}, speed, 'swing');
      return false;
   });
});
</script>

$(function(){

//a hrefをクリック際の処理を例に。

$('a[href^=#]').click(function() {

// スクロール速度(ミリ秒)

var speed = 100;

// アンカーの値取得

var href= $(this).attr("href");

// 移動先を取得

var target = $(href == "#" || href == "" ? 'html' : href);

var position = target.offset().top;

// 移動

$('body,html').animate({scrollTop:position}, speed, 'swing');

return false;

});

</script>