jQueryを使って簡単プルダウンメニュー

lightview

←はサンプル画像なんですが、こんな感じのプルダウンメニューってけっこう使っているサイトも多い気がするので、今回はjQueryを使って簡単に出来ちゃうやり方を紹介したいと思います。

画像をつかったバージョンも使ったので、こちらも参考にして下さい。

…ここからが続き

このプルダウンメニューって使う機会がそう多いわけではないですが、もし使う機会があった時でも使ってみて下さい。

Download

Domo Page

Comments

ジョージ

ジョージ

>jQueryとprototypeの競合でしたら、こちらの記事を参考にして頂けませんか?

ありがとうございます!

全部ページを調べもせず失礼いたしました。
参考にさせていただきます。

2009年12月17日 13:08

MIYA

MIYA

ジョージさん。

jQueryとprototypeの競合でしたら、こちらの記事を参考にして頂けませんか?
http://www.css-lecture.com/log/javascript/029.html

2009年12月17日 10:40

ジョージ

ジョージ

いつも拝見させていただいております。

今回、プルダウンをためさせていただいたところprototype.jsとダウンロードさせていただいたjquery.jsが競合していました。
javascriptを解読できないので何かアドバイスや回避方法などわかりましたらご教授ください。よろしくお願い致します。

prototype.jsはlightboxで使うjsファイルでバージョンは1.4.0で
lightboxとプルダウンを両方利用したかったのです。

あと、ソースの順番の入れ替えで片方が認識されました。

2009年12月16日 18:15

cktcat

cktcat

ご回答、ありがとうございます!!
本当に助かりました。
今後も頼りにしています~。

2008年11月19日 06:46

MIYA

MIYA

すごく嬉しいお言葉ありがとうございます^^

>大文字で英語を打っても小文字で反映されてしまう…

こちらの点なんですが、CSSを見直してみると#nav-one li aに
text-transform: lowercase;
と言う指定が入っているの原因ですね…

上記部分を消して頂いたら今の問題は解決出来ますよ。

後これは余談ですが
text-transform: uppercase;
と指定すると小文字で入力しても大文字で繁栄されます。

2008年11月14日 20:42

cktcat

cktcat

はじめまして、こんにちは。
このサンプルを使わせて頂いてとっても助かりました!
ありがとうございます。
でもただ一つだけ疑問なのですが、大文字で英語を打っても小文字で反映されてしまうのです・・・。(例えばTOPがtopに)

もしも対処法が分かりましたらご教授下さい。
ひょっとして、これは私の方の問題ですかね?!
だったらスミマセン・・・。

分かりやすいサイトでとても気に入っています。

2008年11月14日 09:51

Comment Form

※コメントが認証されるまで、コメントは反映されません。ご了承くださいませ。


(公開されません)
 
Captcha

画像の中に見える文字を入力してください。

page top へ

Sponsor

  • heteml
  • Movable Type

Category

Recent Article

2011 04-05
iPhone スマートフォンサイトのデザインのまとめ
2011 04-04
スマートフォン対応にしてみました
2011 04-01
CSS3 要素を透明に出来る Opacity と RGBa の使い方
2011 03-31
サイトリニューアルしました
2010 12-01
CSS3 でボタンを作る為のテクニック、サンプル集
2010 11-24
綺麗でリッチなフッターデザイン集のまとめ 60
2010 11-18
緑と黒色を使った Webデザインのサイト 25
2010 11-10
知っておいた方が便利なエクセルの知識

Recent Comments

Archive

2011年
2010年
2009年
2008年

Related Article