全盛の頃から、JavaScriptが苦手だったためか

jQueryも苦手です……。

同じスクリプトでもPHPの方が楽です(´・ω・`)

しかし、プラグイン入れて、なんか重たくなっちゃうより良いよね

ということで、最近はjQueryも少しずつ勉強してます。

今回は、何故かちゃんと動かなかった「トップへ戻る」ボタンの出し方をメモっておきます。

一番親切だったのは『りんろぐ』さんでした。

http://wan.207works.com/backtotop-button/

 

しかし、これ通りでは動かず(Themifyテーマは色々読み込んでいるから?)

私がやった方法は下記の通りです。

1)/headの前に

<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script>

とあったので、そのまま使いました。見るとThemifyのテーマで呼んでいるヘッダー部分で

jQueryあるので、良いかも?

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js
"></script>

と、入れても動きました。

2)/body前に

<p id="page-top"><a href="#header">Page Topへ↑</a></p>

を入れて

3)footerのwp-footerを読み込む前に

<script>
jQuery(function() {
var topBtn = $(‘#page-top’);
topBtn.hide();
//スクロールが100に達したらボタン表示
jQuery(window).scroll(function () {
if ($(this).scrollTop() > 300) {
topBtn.fadeIn();
} else {
topBtn.fadeOut();
}
});
//スクロールしてトップ
topBtn.click(function () {
jQuery(‘body,html’).animate({
scrollTop: 0
}, 500);
return false;
});
})
</script>

を入れました。

jQueryに変えてますが、#でも動きました

以上、〆(-ω-´).でした