hirokonaBlog

ググる→忘れそう→即時メモ 京都のWebデザイナーの備忘録

スマホでヘッダ(アドレスバー)隠す強制スクロールをページ内リンクでは解除する

正式には解除してないけど当初の記事名をそのままにしておく。。

普段はページ読み込み時にアドレスバーを消し、 アンカーが付いてる場合だけページ内リンクへ飛ばす

参考サイト:
http://tokidoki-web.com/2013/04/%E3%80%8E%E3%82%B9%E3%83%9E%E3%83%9B%E3%82%B5%E3%82%A4%E3%83%88%E3%81%A7%E3%82%A2%E3%83%B3%E3%82%AB%E3%83%BC%E3%83%AA%E3%83%B3%E3%82%AF%E5%8A%B9%E3%81%8B%E3%81%AA%E3%81%84%E5%AF%BE%E7%AD%96%E3%81%97/

おお〜!動いた。
自分で動かしてやりゃいいじゃんてことですね。

私の環境ではハッシュがない場合にエラーが出たので条件分岐をつけました。

[html]
var checkHash = window.location.hash;

window.onload = function(){
if(checkHash){
var p = location.hash;
var q = $(p).offset().top;
var hashId = p.indexOf(“#”);
if(0 == hashId){
$(‘html,body’).animate({ scrollTop: q }, ‘slow’);
return false;
}
}else{
setTimeout(function(){scrollTo(0,1)}, 100);
}
};

[/html]

とりあえずこれで。

最初は下記の記事をさんこうにさせていただいていました
http://blancbooth.com/archives/category/smartphone

しかしこちらはサイト内の遷移に対してのものなので、
target=”blank”などで外部からリンクされた場合はうまくいきませんでした

今回は外部からリンク貼る必要があったので先のリンクの記述を使わせて頂きました。
ありがたやありがたや。

でもなんでif(checkHash){}の中身空白にしたりreturn falseにしたらうまく動かんのかは
まだ調べてない。謎じゃ。


投稿日

カテゴリー:

投稿者:

タグ:

コメント

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください