はてなブログでカスタマイズしたサイドバー固定のバグが解消！

はてなブログに移行して2週間。カスタマイズも落ち着き、しっかり稼働させることができています。

しかし、ふとPC版でブログを眺めてると、何か違和感が・・・。

f:id:masa381man:20160325121658p:plain

あれ？被ってる？

何故か被る

ブログのサイドバーは、一番下に楽天アフィリエイトのバナーを設置しています。

更に、そのバナーはスクロールすると固定されるようにし、人気記事ランキングの下をスクロールすれば、そこで固定されるはず。

ところが、上手くいかず、「注目の人気記事」までいったところでぴよっと出てきて固定化され、被ってしまう現象。。。

ソースを見ても問題ありそうな箇所はなく、謎は深まるばかり。

ちなみにソースはこんな感じ。

$(function(){
　　var sideLast = $("#box2-inner>div:last-child");
　　var sideLastTop = sideLast.offset().top;
　　var sideLastWidth = sideLast.width();
　　var win = $(window);

　win.scroll(function(){
　　if(win.scrollTop() > sideLastTop) {
　　　sideLast.css("position",'fixed');
　　　sideLast.css("top",'20px');
　　　sideLast.css("width",sideLastWidth);
　　}else{
　　　sideLast.css("position",'relative');
　　};
　});
});

悩むこと小一時間、ググってると、ようやく答えが見つかりました。