ミギムキ

[jQuery] 絶対パス指定のリンクでスムーススクロールしたい

jQuery(function($) { $('a[href^=#]').click(function(){ var speed = 500; var href= $(this).attr('href'); var target = $(href == '#' || href == '' ? 'html' : href); if( target.size() < 1 ) return true; var position = target.offset().top; $('html, body').animate({scrollTop:position}, speed, 'swing'); return false; }); });

サンプルコード

jQuery(function($) { $('a[href*=#]').click(function(){ var speed = 500; var href= $(this).attr('href'); var url = location.protocol + '//' + location.hostname + location.pathname; href = href.replace(url, ''); var target = $(href == '#' || href == '' ? 'html' : href); if( target.size() < 1 ) return true; var position = target.offset().top; $('html, body').animate({scrollTop:position}, speed, 'swing'); return false; }); });
スポンサー広告

補足・解説・仕組み

$('a[href*=#]').click(function(){ 〜 } var url = location.protocol + '//' + location.hostname + location.pathname; href = href.replace(url, '');