JavaScript | うぇぶ小屋

コピペでOK!サイドバーの広告を固定してスクロールに追従させる方法

コピペでOK!サイドバーの広告を固定してスクロールに追従させる方法

こんにちは、@webgoyaです。

最近ちょくちょく見かける、スクロールアウトした後もサイドバーの要素が固定されて付いてくるメニューを当ブログにも導入してみましたので、その設置方法の解説です。

導入自体は簡単なのですが、よく見てみるとスクロールに追従してそのままフッタ―部分に重なってしまってるブログやサイトも多くて、それはなんだかイケてない気がしたので、今回紹介するものは当ブログのようにスクロールに追従後、今度はフッタ―前になるとピタリと止まってくれるやつにしました。

当ブログでは広告をローテーションバナーでランダムに表示させていますが、広告だけでなく、ソーシャルボタンや各種ブログパーツなども固定して追従させる事ができます。

ちなみにAdSenseでこれをやるのはGoogleの規約で禁止されているので違反行為です。
クリック率は間違いなく上がるのでやりたくなるかもしれませんが、アカウント停止などのリスクが無いとも言えませんので止めておいた方が良いでしょう。

参考:Google プロダクトフォーラム

それでは設置方法です。

記事の続きを読む ≫

クリックするとウインドウ内で画像が拡大する「Lightbox2」の設置手順

クリックするとウインドウ内で画像が拡大する「Lightbox2」の設置手順

クリックするとウィンドウ内で画像が拡大するLightbox2 (v2.51)の設置手順です。

記事の続きを読む ≫

とっても簡単!スクロールするとスーっと出現するトップへ戻るボタンを設置する手順

とっても簡単!スクロールするとスーっと出現するトップへ戻るボタンを設置する手順

ページを下にスクロールするとスーっと出てくるトップへ戻るボタンの設置方法です。

導入方法はとっても簡単。

記事の続きを読む ≫

ソースコードを綺麗に見せるJS「SyntaxHighlighter」の設置手順

ソースコードを綺麗に見せるJS「SyntaxHighlighter」の設置手順

ブログをカスタマイズする時、分からないソースコードはその都度ネットで調べるのですが、良く見かけるのが綺麗にハイライトして表示してあるもの。

以前から気になっていて今回このブログでも導入してみたのでその手順を紹介します。

記事の続きを読む ≫

人気記事

最新のエントリー

カテゴリ

ライター募集!