めくる感覚で行き来できるページナビゲーションをCSSで実装する :: 5509
要らないものを削った結果、記事が縦に長くなってしまうもんで、ページナビゲーション（前の記事、次の記事リンク）をどうしようかなぁとか思ってた。 ちょうど、シロさん(@___shiro_)がのを見て、なーるほどと思い実装してみた。 こういったレイアウトのアーカイブのナビゲーションで、元のHTMLを一切触らずCSSだけで飛躍的に（？）ユーザビリティを高められるいい例になったかなぁ。どうやろ。その辺は要検証ということで。少なくとも自分で使う分には超使いやすいからこれはこれでオッケーなんですけども。 配置を決める 真ん中にでーんとコンテンツがあるので、横の余った位置に戻るとか進むとかつけます。 構成とかは以下みたいにすればたぶんいけそうという感じで配置してます。 ナビゲーションを50%:50%でprev:nextをposition: fixedで配置しておき、その上にコンテンツをかぶせる。青い部分が
[JS]ナビゲーション画像にアニメーションのエフェクトをつける -CSS Sprite2
A List Apartのエントリーから、CSS Spriteを使用したナビゲーションに、マウスオーバー時にアニメーションのエフェクトをつける「CSS Sprite2」を紹介します。 CSS Sprites2 - It's JavaScript Time demo 5 demo 6 CSS Spriteとは、スタイルシートで一枚の画像から複数箇所に配置をしたり、マウスオーバー時の画像指定を行うものです。 CSS Sprite2は、そのCSS Spriteにスクリプトを使用して、アニメーションのエフェクトつけたものです。 使用するスクリプトは、デモではjQueryが使用されていますが、PrototypeでもYUIなど他のスクリプトでも実装は可能です。 CSS Sprite2のベースとなっているのは、下記ページとのことです。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
