IBM Developer is your one-stop location for getting hands-on training and learning in-demand skills on relevant technologies such as generative AI, data science, AI, and open source.
ishidaです。 tableで価格一覧や製品一覧などを表示する場合に、行数が長くなるとかなりメリハリのない印象になります。 行ごとにclassを設定すれば見やすくなりますが個別に設定するのも面倒なので、最近のishidaはjQueryを使って背景色を設定しています。 サンプルは以下です。 jQueryでtableの偶数行や奇数行に背景色を設定する方法サンプル 設置方法 設定方法は以下です。 htmlのhead要素に以下の処理を読み込みます。またjqueryはサイトからダウンロードしてください。 <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("table").each(function(){ jQ
25 jQuery Tutorials for Improved Navigation Menus ナビゲーションメニューを1歩進んだものに引き上げるjQueryチュートリアル集が紹介されています。 How to Make a Smooth Animated Menu with jQuery アニメーションする、おしゃれなメニュー Create an Apple Style Menu and Improve it via jQuery Apple風のクールなメニュー。アニメーションしつつ、アイコンも表示してくれなかなかクール Create a Slick Tabbed Content Area Using CSS and jQuery 少ないスペースにタブを設置してメニューにしている例。アニメーションもあり。 Using jQuery for Background Image Animat
お仕事で JavaScript によるプルダウンメニューを実装する必要があり、色々試してみて一番お手軽だったのが「droppy」です。 「droppy」 は jQuery のプラグインです。 パッケージをダウンロードすると色々とファイルが入っていますが、必要なのは src ├ javascripts │ └ jquery.droppy.js └ stylesheets └ droppy.css の 2 ファイルです。 プルダウンメニューの実装は、HTML に以下のコードを貼りつけて CSS を適用すればオッケーです。 ■JavaScript … 外部ファイル化がお勧め <script type='text/javascript'> $(function() { $('#nav').droppy(); }); </script> ■HTML … とてもシンプル <ul id='nav'> <
自分はスーパーJavaScripterでこんなすげーのが5行で書けちゃう。やばいだろ!とかいうのでは全然無いですが、オブジェクト指向っぽい話が最近分かってきたつもりで、それでやっときゃ問題無いってことを思い始めているので、なんかそんな話を書いていきます。 こんな短く書くテクニックがあるぜ! var hoge = hage ? huga : hoga; とか書けちゃうんだぜ!とかより、長くていいから分かりやすく拡張しやすいようにするにはどうするのかとか、そういう話ができればなーと思います。内容的には全くもって新しくも何とも無いですが。jQuery使ってやる前提です。 まんじゅう製造スクリプト 今日はまんじゅうを5個作ります。なんと、まんじゅうは、クリックすると隠れます。 まんじゅうサンプル var Manju = function(){ this.elem; this.hidden = fa
ToggleVal :: jQuery Plugins by Aaron Kuzemchak 入力ボックスでクリックすると消えるデフォルト値を簡単実装「ToggleVal」。 入力ボックスにデフォルトでヒント値を入れておいてクリックすると消えるあの分かりやすいインタフェース。 実際に実装するとなると、ちょっと面倒ですが、ToggleValを使えば、メソッドを1回呼び出すだけで簡単に実装できます ↓↓↓↓クリックで消える↓↓↓↓ jQueryプラグインなので、以下のように使いやすくなっています。 $("input[name='name']").toggleVal( { option } ); 実装したくなった時、ちょっと面倒でまた今度、とならないようにこれを覚えておけばよさそう。
MyPHPDuniaというサイトで、jQueryのサンプルTOP10がまとまっています。 かなり使えるものばかりな感じですね。 » スライドタブボックス » Appleのサイトで使われているようなメニュー » 画像をズーム » 画像の上にスライドするキャプション » メニューの背景にスライドする画像 » タブで画像を切り替える » メニューにフェード効果 » アコーディオンメニュー » タブによるコンテンツ切り替え » タブメニュー 詳しくは以下からどうぞ。ソースコードもダウンロードできますね。 » Top 10 Jquery Examples with Live Demos わいわいと飲み会。超たのしかったぞ。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く