CSSで設定する背景画像(background-image)を遅延読み込みさせるスクリプトを無料でダウンロードできます。既存のページにも簡単に組み込めるようになっています。
ページ内にあるタイトル(見出し)をクリックした際に、本文がスライドダウンで表示されるスクリプトを作りました。見出しに使うタグはh1やh2などのhタグに限らず、pでもdivでもなんでもOKですので、既存のページ内に組み込みやすいでしょう。
マウスオーバーさせた時に画像を切り替えるのはCSSの:hover疑似要素を使用するのが基本となりますが、フェード演出で切り替えたい場合もありますね。そのようなフェード演出を簡単に実装できるスクリプトを作りました。無料でダウンロードでき、既存サイトに簡単に実装できます。
ページを下に少しスクロールされると「ページ最上部に戻る」が出現し、そのボタンをクリックするとページ最上部にアニメーションで戻るスクリプトを作りました。サイトを制作する度に毎回同じコードを書いたりコピペするのも面倒なため、簡単に組み込めるようにできています。
ページ内リンクはスクロールのアニメーションなどもなく一瞬で移動するため、ページ内のどの部分に移動したのかがわかりにくいのが欠点です。ページ内リンクにスクロールのアニメーションを簡単に付加できるスクリプトを作りました。既存ページに組み込むのも超簡単です。
タブをクリックして表示エリアを切り替えるスクリプトを作りました。既存のページに組み込みやすくできています。特にスマホの場合は画面上に表示できるページ領域が狭いため、このスクリプトを使用することで簡単に各エリアをタブ切り替え式にすることができます。
ドロップダウン式(縦方向の折り畳み式)のスマホ用メニューを簡単に設置できるスクリプトを無料ダウンロードできます。CSSが理解できる人なら自由にデザインを変更したり、多重階層にすることも可能でしょう。
サイト上にあるリンクをクリックしたらいきなりPDFファイルが開かれ、その表示の遅さにイライラした経験はありませんか?あなたのサイトがそのような糞サイトにならないよう、PDFファイルへのリンクをクリックした際に確認ウインドウを表示させるスクリプトを作りました。無料でダウンロードしてお使いください。
複数の画像からランダムで1枚をホームページ上に表示させるスクリプトを無料ダウンロードできます。画像ファイルの大きさや枚数に制限がなく、それらの設定もHTMLとCSSファイルを編集するだけで表示されます。JavaScriptファイルの編集は不要です。
主要SNS(Twitter、Facebook、Google+、はてなブックマーク)のボタンをまとめて設置できるスクリプトを制作・公開しました。無料ダウンロードできます。スマホなどの高解像度にも対応しています。