Dancing★Onigiriを中心に雑多なことをやってるサイトです。

※現在サイト引越し工事中です。


ドツボにハマった時が一番怖いの巻
2017/04/14(金) 雑記

前のサイトからこのWordPressに色々移行するにあたって、
一つ壁にぶち当たったのが「スムーズスクロール」関連。
悪戦苦闘した結果マジかよって言いながら解決したのでランボー怒りの殴り書き。

スムーズスクロールというと、
<a name="hoge" id="hoge">ここに飛ぶよ。</a> <br /> <br /> <br /> <a href="#hoge">ページ内ジャンプ</a>
みたいなページ内ジャンプを、jQueryの機能を使って
別ページへのリンクとして扱わずシャーッてページスクロールするアレです。

これが何故か上手いこと動いてくれない。
しゃーねーなーってことで実装し直ししようとして、
このページにたどり着いたわけですよ。
http://jQuery でページ内リンクを全てスムーズスクロールにしよう
で、ここからソースコードをコピペで引っ張ってきたけど、それでも動かない。
しかし何故かウチのサイト右下に置いてある「ページトップへ戻る」は
移行した直後から元気に動いてることが判明する。

ますますワケが分からなくなり、
おっかしーなーって言いながらサイトやらソースを色々眺めてると、
jQuery リファレンス:[ 属性名 ^= ‘値’ ]
このサイトで$(“[ 属性 ^= ‘値’ ]”)って書いてまして。
で、ですよ。

>ページスクロールサンプル
$(‘a[href^=#]’).click(function() {
>jQuery リファレンス
$(“[ 属性 ^= ‘値’ ]”)
>動いてる右下のページトップジャンプ
$(‘.backtop’).click(function () {

んん????

$(“[ 属性 ^= ]”) ←ここ注目

いやまさかなー…って思いながら、
$(‘a[href^=#]’).click(function() {
と書き直してみると

あっさり動いた。

3時間以上かかってこんなオチとかふざけんな!って感じでした^q^

考えられる原因としてはWordPress移行にあたって、
HTML4の記述からHTML5の記述へと変えたので、
その辺でjavascriptの変数に融通がきかなくなってたのかも?

変数の宣言、代入はしっかり厳格に行いましょう…(教訓

コメント