- 締切済み
children div指定
こんにちは、 下記のjquetyで自分の下にいる <div class="exp">の'background-image'を表示したいのですが、 うまく指定できません。 'div.exp'をどのように記述すればよいでしょうか？ $('#T1').click(function(e) { exp = $(this).children('div.exp').css('background-image'); alert(exp); } html----------------------- <div id="T1"> <h2 class="Title"></h2> <div class="exp"></div> </div>
- lensent
- お礼率10% (42/402)
- JavaScript
- 回答数2
- ありがとう数0
- みんなの回答 （2）
- 専門家の回答
関連するQ&A
- html divについて
html divについて 現在、html・CSSを勉強中です。 htmlのDivの中で画像を貼っているのですが、左端の中央に設定したいのですが、うまく行きません。 左端中央に画像を表示できる方法を教えてください。よろしくお願い致します。 ↓ html ↓ <div class="area"> <div class="area_left"> <div class="01"> : </div> <div class="02"> : </div> <div> <div class="area_right"> <div class="03"> : </div> <div class="04"> <img src=" "> </div> </div> </div> ↓ CSS ↓ div.area_right .04{ vertical-align: middle; width: 197px; height: 159px; background-image: url("area_04.gif"); }
- ベストアンサー
- HTML
- CSS使用時のDIVにおける背景指定について
現在ホームページの作成でＣＳＳをメインに練習を行なっております。 テーブル配置を最小限にと思い、ＣＳＳにて制作を試みておりますが、 ヘッダー部分だけがどうしても上手くいかずつまずいてます。 色々なＣＳＳに関するページも検索しましたが、いまいちピンと来るものもなく、もしかしたら出来ないのかな？とも考え始めております。 でも、大手のサイトなどを拝見する限り見栄え的にも出来ている様なので自分にＣＳＳに対する理解が低いのかとも思いますが、どうかご教授 をお願いいたします。 先ず構想図から… －－－－－－－－－－－－－－－－－－－－－－ ｜ DIV id="h-top" ｜ －－－－－－－－－－－－－－－－－－－－－－ ｜ DIV id="h-cate" ｜ －－－－－－－－－－－－－－－－－－－－－－ ｜ ｜ ｜ ｜ ｜ ｜ ｜DIV ｜ DIV ｜ ｜id="index"｜ id="main" ｜ ｜ ｜ ｜ ｜ ｜ ｜ ｜ ｜ ｜ －－－－－－－－－－－－－－－－－－－－－－ ｜ DIV id="footer" ｜ －－－－－－－－－－－－－－－－－－－－－－ 上記のようなありがちなレイアウトのＨＰを考えています。 DIV id="h-top",id="H-cate"においては通常のヘッダーとしています。 質問は、上記のDIV内容の記述についてなのですが、 ●DIV id="h-top"は、 横100%に対し、横20PX、縦100PXの背景画像を並べ、中央に横740PX、 縦100PXのメイン画像画像を入れたいと思っております。 ●DIV id="h-cate"には、 横100%に同じく背景画像として横20PX、縦43PXの画像を並べ、中には 横740PXに合わせたナビボタン（w123*h40）を６つ配置したいと考えています。 共に画像とナビボタンは配置可能なのですが、背景画像が表示できなく 困っております。 現状でのHTML文では以下の通りとなっております。 <body> <DIV id="header"> <DIV id="h-top"> <img src="hoge" width"740" height"100" alt""> </DIV> <DIV id="h-cate"> <ul class="h-navi"> <li class="h-navi01"> <A href="index.html"> <span class="span1">トップページ </span></A> </li> <li class="h-navi02"> <A href="web/index.html"> <span class="span1">取扱商品一覧 </span></A> </li> ・ ・ ・ </ul> </DIV> </DIV> </body> ＣＳＳも書こうと思いましたが、色々とやりくりして今では表示も 配置もおかしくなってしまいましたので、控えさせて頂きました。 また説明文が下手で分かりづらいかと思いますが、どうぞ宜しくお願いします。
- ベストアンサー
- CSS
- jQueryで指定された要素のIDに触れた時イベントを起こしたいのです
jQueryで指定された要素のIDに触れた時イベントを起こしたいのですがうまくいかずに困っています。 jQuery(document).ready(function($) { var msg = ""; $("#Div11").mouseover(function() { msg = "おはよ" alert(msg); }); $("#Div2").mouseover(function() { msg = "こんにちは" alert(msg); }); $("#Div3").mouseover(function() { msg = "うっすー" alert(msg); }); $("#Div4").mouseover(function() { msg = "お疲れ様でした" alert(msg); }); $("#Div5").mouseover(function() { msg = "こんばんは" alert(msg); }); }); このような記述をしているのですがIDに触れた時、値を代入してメッセージを表示させたいのですが出来ません。 どなたかご教示願います！
- ベストアンサー
- JavaScript
- 【CSS】CSSでh1タグに背景を指定し、画像の中の任意の場所に文字を書き込みたいのですが、うまくいきません
【質問】CSSでH1タグに背景を指定し、画像の中の任意の場所に文字を書き込みたいのですが、上下に余計な空白ができてしまい困っています。 【狙い】高さ32pxの3枚の画像ABCを縦につなぎ合わせた、高さ96pxの一枚の画像(=***)をCSSでH1の背景にし、H1の内容に応じてHTML上でclassを変えて、背景をAにしたりBにしたり変えられるようにする。 【コード】 CSS h1 {height: 32px;background-image: url(***);} .a h1{background-position: 0 0;} .b h1{background-position: 0 -32px;} .c h1{background-position: 0 -64px;} .a,.b,.c{margin: 0;padding: 0;} /*-↓画像のタテの中心に文字を並べるためにpaddingをとります-*/ h1 .subject{padding-top:9px;margin: 0;} HTML <div class="b"> <!--←A,B,Cに画像を切り替えます。//--> <h1><div class="subject">助けてください（ T＿T）</div></h1> </div> 【現状】 IE7 H1の下に余計な空白ができてしまいます。 FireFox3 H1の上下に余計な空白ができてしまいます。 どうすればよいのでしょうか？どこを修正すればよいのでしょうか、また 代替案があれば教えてくださるとありがたいです。
- ベストアンサー
- HTML
- DIVの入り子のwidthの指定方法
DIVの入り子のwidthの指定方法がうまくいきません。 ＜ｃｓｓ＞ #main { width: 770px; margin: auto; padding: 0px; text-align: left; background-color: #cc0000; } .box_main{ width: 750px; background-color: #FFFFFF; margin: 0px 10px 10px 10px; padding: 0px; border: 0px; } .box_1{ margin: 5px 2px 5px 5px; padding: 0px; border: 0px; height: 299px; width: 236px; background: url(img/test2.jpg); float: left; } .box_2{ margin: 5px 5px 5px 0px; border: 0px; height: 295px; width: 491px; background-color: #33ff00; float: left; } .cl { clear: both; } この際、.box_mainの中にbox_1、box_2を横ならびにおきたいのですが うまくいきません。box_2のWIDTHの幅の指定がおかししのでしょうか？ HTMLは<html> <body> <div id="main"> <div class="box_main"> <div class="box_corner">あああああ</div> <div class="box_1"></div> <div class=box_2></div> <div class="cl"> </div> </div> </body> </html> です。
- 締切済み
- HTML
- CSSでの背景の指定について教えてください。
背景がうまく指定できません。よろしくお願いします。 フォルダ（img)の中にbana(ファイル名）750×100のjpgの画像が置いてあります。 CSSの指定は #head{ width:750px; height:100px; background-color:#ffffff; background-image:url(../img/bana.jpg); border-bottom:#999999 solid 1px; } HTMLは <div id="head"> <h1>・・・・・・</h1> </div> です。色々と試してみたのですが、背景が入ってくれません。 初心者ですので説明不足かもしれませんが よろしくお願いします。
- ベストアンサー
- ホームページ作成ソフト
- jQueryでCSSの背景画像を切り替えたい
見出しをクリック後にCSSで指定している背景画像を変えるため、jQueryでCSSを変更させてみたところ上手くいきません。 jQueryで指定する変更後の背景画像を絶対パスに換えたら上手くいったので、 パスの指定方法が悪いところまでは分かったのですが、相対パスでの指定方法がわからなくなりました。 WordPress環境で下記のコードを使用しています。 ご教授の程、よろしくお願い致します。 【 jQuery】 ○ディレクトリ ： テーマフォルダ/js/change.js jQuery(function() { jQuery("h3 div.class").hide(); jQuery("h3").click(function() { jQuery(this).next().slideToggle("fast"); jQuery(this).css("background-image" , "url('img/pic2.jpg')"); }); }); 【CSS】 ○ディレクトリ : テーマフォルダ/style.css h3 { background: #7c8187; background-image: url(img/pic.jpg); cursor: pointer; } 【画像】 ○ディレクトリ : テーマフォルダ/img/pic.jpg テーマフォルダ/img/pic2.jpg
- ベストアンサー
- CSS
- javascriptについて教えてください。
divのボタンを作りたいと思い、調べながらjQueryを使う方法は以下のようにしたらいい事は分かったのですが、jQueryを使わずにしようと思い $(function(){ $("div").click(function(){ var x = this.id; alert(x); }); }); の部分を document.getElementsByTagName("div").onclick = function(){ var x = this.id; alert(x); }; としてみたのですが、うまくいきません。jQueryを使わずに同じようなボタンを作るにはどうしたらいいのでしょうか？ <!doctype html> <html> <head> <meta charset="UTF-8"> <title>無題ドキュメント</title> <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.1.4.min.js"></script> <script type="text/javascript" language="javascript"> $(function(){ $("div").click(function(){ var x = this.id; alert(x); }); }); </script> </head> <body> <div id="aaa" class="div_link">a</div> <div id="bbb" class="div_link">b</div> <div id="ccc" class="div_link">c</div> <div id="ddd" class="div_link">d</div> <div id="eee" class="div_link">e</div> </body> </html>
- ベストアンサー
- JavaScript
- cssで<div>にpaddingを指定したとき
下のように、ｃｓｓで<div>にwidth720px、padding10px,background-color: #00FFFF;と指定して、 IE6とoperaで表示してみたところ、widthが740px、padding10pxになってしまいます。 divの下に７４０pxのテーブルをおいて確認してみました。 これは、こういうものと、思うしかないのでしょうか？ また、こうなるのは、私だけなのでしょうか？ <style type="text/css"> <!-- #contents { width: 720px; padding: 10px; background-color: #00FFFF; } --> </style> </head> <body> <div id="contents"> あああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああ </div> <table width="740" border="0"> <tr> <td bgcolor="#0000FF">あ</td> </tr> </table> </body>
- ベストアンサー
- HTML
- click範囲の指定
jQuery1.52を使用しています。 <div id="1">1111<div id="2">111</div></div> /*CSS*/ #1{padding:50px;} 例としてこういうhtmlがあった場合で、 $("#1").click(function(){ $("#2").css("display","none"); }); #1をクリックした場合、ただし#2と重ならない範囲で、 (#1の文字やパディング範囲では効果ありとして、#2の範囲では効果を除外したい) という指定を行いたいのですが、記述方法が検討がつきません。 これはどのようにしたらよいのでしょうか？
- ベストアンサー
- JavaScript
- 試合中に彼が揺さぶってきたりして途中で読めなくなって、急に今だ！って言い出して、何？って思いながら足を狙われて私は悲鳴をあげながら倒されそうになったのですが、観客席は思わずおお！とか、決まったか？とか聞こえてきました。
- 間一髪避ける事が出来たのですが、体制が不利な状況で、そうだお姉ちゃん押さえこないとって言い出して、ハッと私は思って立て直そうとしていたのですが、貴重なチャンスを物にしようと必死に押さえこんできました。
- 終わったあとは彼を応援する子達が盛り上がっていて、私を応援してくれた子は、顔を手で押さえていたりしていました。一つ一つの声出しが効いた試合って言ってたのですが大事でしょうか？普段は大人しい子なのですが、思わず声が出てしまったようです。
補足
こんにちは、 ＞どういう状況を「できない状態」と言っているのですか？ 設定しているbackground-imageの値を表示したいのですが noneと表示されてしまい取得できていないといった感じです。 ＞もっとも、clickの箇所、カッコ閉じられていないですが。。 記載ミスです。＞＜