jqueryによるスムーズスクロールのメモ
まず先にjquery-3.1.1.min.jsを読み込む
<script type='text/javascript' src='http://xxxx.jp/js/jquery-3.1.1.min.js'></script>
jqueryの設定は以下
jQuery(function($){
$('a[href^="#"]').click(function() {
// クリックした要素のhref属性の値を取得
var anchor = $(this).attr('href');
// 表示位置を取得
var position = $(anchor).offset().top-20;
// アニメーションの効果の作成
$('body,html').animate({ scrollTop : position }, 500, 'swing');
return false;
});
});
<a href="#koko">#kokoというidのところへスクロールする</a>
<span id="koko">このidの付いた要素へスクロールしてくる</span>
記事id:860 / 1824PV
関連記事
Warning: simplexml_load_file() [
function.simplexml-load-file]: php_network_getaddresses: getaddrinfo failed: hostname nor servname provided, or not known in
/home/session-2/www/02_zatu/system_files/core_sys.php on line
41
Warning: simplexml_load_file(http://www.jigen.xyz/index.xml) [
function.simplexml-load-file]: failed to open stream: php_network_getaddresses: getaddrinfo failed: hostname nor servname provided, or not known in
/home/session-2/www/02_zatu/system_files/core_sys.php on line
41
Warning: simplexml_load_file() [
function.simplexml-load-file]: I/O warning : failed to load external entity "http://www.jigen.xyz/index.xml" in
/home/session-2/www/02_zatu/system_files/core_sys.php on line
41
Warning: Invalid argument supplied for foreach() in
/home/session-2/www/02_zatu/system_files/core_sys.php on line
42