サービス終了のお知らせ NAVERまとめは2020年9月30日をもちましてサービス終了いたしました。 約11年間、NAVERまとめをご利用・ご愛顧いただき誠にありがとうございました。
派手なアクションや演出はありませんが、WEBサイト構築において、ちょっとした気の利いた所を押さえているjavascriptが今回紹介するJavaScript「yuga.js」です。 簡単に導入できる上に「jQuery」を使って様々な事が簡単なコードで実現可能です。優雅なWeb制作のためのJS サンプルと銘打っているだけあって実相もシンプルでわかりやすいJavaScriptになっています。 詳しくは以下 yuga.jsでできることは以下の通りです。 ・画像のロールオーバーを簡単にする機能 ・外部リンクは別ウィンドウを自動で設定 ・画像のリンクをthickboxで開くよう簡単設定 ・偶数、奇数行を自動で色分け ・ページ内リンクのアニメーション機能 詳しい動作や導入方法については「yuga.js 0.4.2 – 優雅なWeb制作のためのJS|CSS HappyLife」で詳しく参照することができ
ひょんな事から、yuga.jsを作られたKyosukeさんから未公開最新版のyuga.js 0.4.2 をもらっちゃいました! 嬉しさのあまり、本人に公開と配布の許可を確認したら快諾していただいたので、せこせことデモページも作ったっす。 元々CSS Nite LP2で紹介したJSなんで、デモっぽいデモも無いかな?と思い用意したというのもあるのですが。 あ、yuga.jsってのはjQueryのプラグインです。jQuery使って優雅なWeb制作しちゃおーっていう感じだとボクは思ってます。 まぁ何はともあれデモをば。 デモページ デモページごとダウンロード(zip:241kb) yuga 0.4.2 ダウンロード(5kb) デモページは、IE6無視してます。IE6でどんなに素敵なことになってても仕様です。 ですので、Fx、IE7、Opera、Safari3(Winでしか見てないけど)辺りで見てい
a:hover{color: blue; text-decoration: underline} 補足 擬似クラスは文脈セレクタと組み合わせて使用することができます。 em a:link{color: green} また、通常のクラスと組み合わせることもできます。この時、通常のクラスを先に、擬似クラスを後に書かなければなりません。 a.external:visited{color: silver} <a class="external" href="http://foo.hoge/">お勧めリンク</a> 上の例のようなリンクをあなたが既に閲覧済みであれば、このリンクは薄い灰色で表示されることになります。 擬似要素(Pseudo-elements) first-line擬似要素(The 'first-line' pseudo-element) その名の通り、最初の一行だけに指定したスタイル
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く