jquery not()がきかない
- jqueryのnot()メソッドが正しく機能しない問題について
- 要素の条件に一致しない要素を選択するためにnot()メソッドを使用していますが、特定の要素を除外できない問題が発生しています。
- 試した解決策の一つとして、not()メソッドを使って#photogalleryというID以外の要素を選択しようとしていますが、うまく動作しません。
- ベストアンサー
jquery not()がきかない
jqueryについて１点だけ教えて頂きたいことがございます。 今、下記のjqueryにてロールオーバー時のイベントを実行しています。 $('a:not(.current) img').each(function() { var target = $('a:not(.current) img') target.hover(function(){ $(this).stop().fadeTo(500,0.6); }, function() { $(this).stop().fadeTo(500, 1); }); }); それともう一つjqueryである一部分だけ違うロールオーバーにしたく、 全体にかかる上記のjqueryで、#photogalleryというID以外の(a:not(.current) img)にしたいのですが、 ('a:not(.current) img')を $('div').not('#photogallery').find('a:not(.current) img') このようにしてみたのですが、#photogalleryまで実行されてしまいます。 調べて見たのですがわからず、教えて頂ければ幸いです。 どうぞ宜しくお願い致します。
- yukiponta
- お礼率53% (62/115)
- JavaScript
- 回答数6
- ありがとう数1
- みんなの回答 （6）
- 専門家の回答
質問者が選んだベストアンサー
こんにちは。 $('div:not(#photogallery a img)').find('a:not(.current) img'); ですと取得した要素の中の#photogallery gallery a imgを除く動きになります。 この場合、取得した要素というのはdivですのでnot(#photogallery a img)としても除去できません。 not(#photogallery)とするとdiv#photogalleryは除かれます。 なので $('a img:not(#photogallery a img)')と書いてあげれば a imgで取得した要素の中から#photogalleryに属するa imgを除去します。 あくまで取得した要素から除くので前者の取り方では思ったような取得にはなりません。 除いたものを取得するのではなく、取得したものから指定されたものを除くと考えるとわかりやすいかもしれません。 自分の解釈ですので間違えていたらすみません。
その他の回答 (5)
- LancerVII
- ベストアンサー率51% (1060/2054)
こんにちは。 すごく簡単に言うとHTMLの構造が違うためです。 階層と取得部分をじっくり追ってみてください。 (高機能な分、いろいろな書き方が出来ますので、時間があったら試してみてください。)
補足
$('div:not(#photogallery a img)').find('a:not(.current) img'); 上記のjsでは、まず全てのdivを取得して、その中から#photogallery a imgを除外。 この除外したdivの中からa:not(.current) imgをさがすという意味であっているとは思うのですが、おっしゃる通り階層と取得部分を追っては見ましたがわかりませんでした。大変恐縮ではございますが、おしえていただけませんでしょうか。。
- LancerVII
- ベストアンサー率51% (1060/2054)
こんにちは。 選択される対象がc_left,c_right,c1～c5だとしたら $('a img').not('#photogallery a img').each 感じになると思いますがいかがでしょうか。 a imgを取得した中から#photogalleryのa imgは除去という感じです。
補足
できました！！ありがとうございます！！ すっきりしました！！ ですがなぜ $('body').find('div:not(#photogallery a img) a:not(.current) img'); や $('div:not(#photogallery2 a img)').find('a:not(.current) img'); これだと動かないのでしょうか？？
- LancerVII
- ベストアンサー率51% (1060/2054)
こんにちは。 HTML全文とは言わないので今動かそうとしているHTMLをそのまま貼ってみてください。 <body>～</body> (画像パス等やコンテンツ内容は無くてもいいです。構造だけ知りたいです) jQueryでのセレクタ操作はHTMLの構造が完全に同じでないと違う回答をしてしまう恐れがあります。
補足
<body> <div id="wrap"> <div id="sec4"> <div id="carousel"> <a href="#"><img src="img/c_left.gif" id="btn_left" /></a> <a href="#"><img src="img/c_right.gif" id="btn_right" /></a> <div id="carousel-inner"> <div id="carousel-move"> <ul class="column"> <li><a href="#"><img src="img/c1.gif" /></a></li> <li><a href="#"><img src="img/c2.gif" /></a></li> <li><a href="#"><img src="img/c3.gif" /></a></li> <li><a href="#"><img src="img/c4.gif" /></a></li> <li><a href="#"><img src="img/c5.gif" /></a></li> </ul> </div> </div> </div> </div> <div id="sec5"> <div id="photogallery"> <ul id="photoList"> <li><a href="#"><img src="img/01.gif" alt="" /></a></li> <li><a href="#"><img src="img/02.gif" alt="" /></a></li> <li><a href="#"><img src="img/03.gif" alt="" /></a></li> <li><a href="#"><img src="img/04.gif" alt="" /></a></li> <li><a href="#"><img src="img/05.gif" alt="" /></a></li> </ul> <ul id="thumbList"> <li><a href="#"><img src="img/ss1.gif" alt="" /></a></li> <li><a href="#"><img src="img/ss2.gif" alt="" /></a></li> <li><a href="#"><img src="img/ss3.gif" alt="" /></a></li> <li><a href="#"><img src="img/ss4.gif" alt="" /></a></li> <li><a href="#"><img src="img/ss5.gif" alt="" /></a></li> </ul> </div> </div> </div> </div> </body> こちらになります。 勉強用に作ったファイルなので、 グローバルナビゲーションなどはございませんが、 カルーセルで動くブロックと、先ほどのスライドショーのブロック、 この二点を表示しております。 どうぞ宜しくお願い致します。
- LancerVII
- ベストアンサー率51% (1060/2054)
こんにちは。 補足頂いたHTMLですと全て#photogalleryの中ですが、以下のようになっているイメージで良いのでしょうか。 <div id="photogallery"> <ul id="photoList"> <li><a href="#" class="current"><img src="img/01.gif" alt="" /></a></li> <li><a href="#"><img src="img/02.gif" alt="" /></a></li> <li><a href="#"><img src="img/03.gif" alt="" /></a></li> <li><a href="#"><img src="img/04.gif" alt="" /></a></li> <li><a href="#"><img src="img/05.gif" alt="" /></a></li> </ul> <ul id="thumbList"> <li><a href="#"><img src="img/slidebtn1.gif" alt="" /></a></li> <li><a href="#"><img src="img/slidebtn2.gif" alt="" /></a></li> <li><a href="#"><img src="img/slidebtn3.gif" alt="" /></a></li> <li><a href="#"><img src="img/slidebtn4.gif" alt="" /></a></li> <li><a href="#" class="current"><img src="img/slidebtn5.gif" alt="" /></a></li> </ul> </div> <div id="nonphotogallery"> <ul id="nonthumbList"> <li><a href="#"><img src="img/non1.gif" alt="" /></a></li> <li><a href="#"><img src="img/non2.gif" alt="" /></a></li> <li><a href="#"><img src="img/non3.gif" alt="" /></a></li> <li><a href="#"><img src="img/non4.gif" alt="" /></a></li> <li><a href="#" class="current"><img src="img/non5.gif" alt="" /></a></li> </ul> </div> 上のような構成であれば $('body').find('div:not(#photogallery) a:not(.current) img').each (function() { でdiv#photogallery以外のdivにあるaタグの.currentがついていないimgが取得できます。 この場合nonphotogalleryにあるimg 意図が違っていたらすみません。
補足
意図はあっておりますありがとうございます。 currentというのはあるjsでcurrentをつけていて、 aタグにcurrentがついてる場合はロールオーバーさせたくないのでつけているだけなんです。 なのでhtml上でcurrentをつける必要はないんですね。 currentは無視していいです。 つまり、('a:not(.current) img')ではなく('a img')として考えていただければ と思うのですが、 今全体にかかるロールオーバーではimgに透明度0.6、ロールアウトした際には透明度1に戻るというイベントをおこしています。 ただスライドショーの方でもロールオーバーロールアウトの指示をだしているのでどちらもかかってしまうんですね。 こちらではロールオーバーさせると、liに透明度0.6かかり、 ロールアウトした際には仕様により0.6のままにしてあるんです。 つまり現状ではliにロールオーバーさせるとliにもimgにも透明度が0.6かかり、 透明度が0.6以下（0.6より薄くなる）になり、ロールアウトするとimgは透明度0.6にもどるという状態になってしまっているんですね。 ですので#photogallery2のa imgにはロールオーバーさせないよう、 全体のロールオーバーのjsに分岐させたいのですが、 うまくいかず、 LancerVIIさんの書いていただいた $('body').find('div:not(#photogallery) a:not(.current) img').each (function() { これをやってみたのですが、#photogalleryの方にもかかってしまっています。 なぜなのでしょうか。。。 以前LancerVII様にはキャッシュのご質問にご回答していただきまして、 本当に感謝しているうえでまた私の質問を考えてくださいまして、 本当にありがとうございます。
- LancerVII
- ベストアンサー率51% (1060/2054)
こんにちは。 HTMLはどのような構成になっていますか？
補足
書き込みありがとうございます。 htmlは下記のようになっています。 下記のhtmlでスライドショーのjsを組み込んでいるのですが、 通常のロールオーバー（質問時に書いたjs）のjsとともにきいてしまっているので、 それを回避したいと思っています。 ただ単に通常のロールオーバーのjsにセレクタを指定すればいいだけの話なのですが、そうするとロールオーバーするもの全てを指定しなければならなくなってしまうので、逆に通常のロールオーバーをさせないセレクタを指定して簡潔に書ければなと思い質問させていただきました。 <div id="photogallery"> <ul id="photoList"> <li><a href="#"><img src="img/01.gif" alt="" /></a></li> <li><a href="#"><img src="img/02.gif" alt="" /></a></li> <li><a href="#"><img src="img/03.gif" alt="" /></a></li> <li><a href="#"><img src="img/04.gif" alt="" /></a></li> <li><a href="#"><img src="img/05.gif" alt="" /></a></li> </ul> <ul id="thumbList"> <li><a href="#"><img src="img/slidebtn.gif" alt="" /></a></li> <li><a href="#"><img src="img/slidebtn.gif" alt="" /></a></li> <li><a href="#"><img src="img/slidebtn.gif" alt="" /></a></li> <li><a href="#"><img src="img/slidebtn.gif" alt="" /></a></li> <li><a href="#"><img src="img/slidebtn.gif" alt="" /></a></li> </ul> </div> どうか宜しくお願い致します。
関連するQ&A
- jqueryについて困っております。
下記のスライドショーを同一ページ内に複数つけたいのですが、 バグがでてしまいます。 おそらく変数がバッティングしてしまっていて、photogallery1とphotogallery2が 干渉しあわないようにしたいのですが、どのようにしたらいいかわかりません。 ご教示いただければ幸いです。 すみません大変急いでおりまして、出来ればすぐに皆様のお力を貸していただければ と思っております。よろしくお願いいたします。 $(function(){ pg('#photogallery1'); pg('#photogallery2'); function pg(selector){ $(selector).each(function(){ var photo = $(".photoBox").find('li'); var thumb = $(".thumbBox").find('li'); var fadeSpeed = 400; var changeSpeed = 4000; var photoLength = photo.length; var nowBox = 0 photo.filter(":not(':eq(0)')").hide(); var timer = setInterval(slideshow , changeSpeed); function slideshow(){ if(nowBox == photoLength - 1){ photo.fadeTo(fadeSpeed , 0); nowBox = 0; photo.eq(nowBox).fadeTo(fadeSpeed , 1); }else{ photo.fadeTo(fadeSpeed , 0); nowBox ++; photo.eq(nowBox).fadeTo(fadeSpeed , 1); } }; thumb.hover(function(){ clearInterval(timer); $(this).stop().fadeTo(fadeSpeed , 0.6); nowBox = $(this).index(); photo.stop().fadeTo(fadeSpeed , 0) .eq(nowBox).stop().fadeTo(fadeSpeed , 1); },function(){ timer = setInterval(slideshow , changeSpeed); $(this).stop().fadeTo(fadeSpeed , 1); }); }); }; });
- ベストアンサー
- JavaScript
- jqueryについて
サムネイルをマウスオーバーすると#targetに拡大画像を表示するものなのですがマウスオーバーで 切り替わりマウスアウトで元に戻るとこまではいいのですがフェードが全く効きません。 いろいろ試したところ$(".thumbnail a img")に変えるとフェードはするのですが今度は画像が 切り変わらなくなってしまいす。両者実装するにはどのように書き換えればいいのでしょうか？ $(document).ready(function() { var originSrc = $("#target").attr("src"); $(".thumbnail a") .fadeTo(1,1) .hover( function() { var changeSrc = $(this).attr("href"); $("#target").attr("src", changeSrc); $(this).fadeTo(200, 0.5); }, function() { $("#target").attr("src", originSrc); $(this).fadeTo(500, 1); } ) });
- 締切済み
- JavaScript
- jQueryの :not() .not() が有効になってくれない
jQueryの :not() .not() が有効になってくれない 一部のクラスを除いて処理をしようと思っています。 notを使いたいのですが、思うように動作してくれません。 スクリプトの問題なのか、HTMLの問題なのか…。 原因究明にご協力お願いします。 http://www.wp-start.com/jquery_test/test2.html 詳しくはソースを見て頂きたいのですが… http://www.wp-start.com/jquery_test/function.js マウスホバーとマウスクリックで クラス _e,_h でアクションを起こします。 でも、クラス _bigbox に入っている _e,_h は無反応にしたいのです。 このソースは問題部分だけを抽出しています。 notの逆に個別に指定するのは極めて煩雑になってしまいます。 できればjQueryのnotで解決したいと考えています。 よろしくお願いします。 以下、ソースの一部です。 -------------------------------------------------- //_hクラス $("div:not(._bigbox) ._h").hover( function () {$(this).css("border","2px solid red") }, function () {$(this).css("border","none") } ); //_hクラス $("div").not("._bigbox").find("._h").click(function () { alert("click _h"); });
- ベストアンサー
- JavaScript
- JQUERYについて教えてください。
JQUERYについて教えてください。 readyがDOMを読み終わってから実行しろという意味は分かったのですが、 あったりなかったりするfunction()はどんな意味なのでしょうか？ function(){ $(this).stop().animate({'marginBottom':'60px'},150); },function(){ $(this).stop().animate({'marginBottom':'0px'},120); こちらにあるのですがメソッドに一個必須なのでしょうか？ 例 <script type="text/javascript"> $(document).ready(function(){ $('div#goto_top').hover( function(){ $(this).stop().animate({'marginBottom':'60px'},150); },function(){ $(this).stop().animate({'marginBottom':'0px'},120); </script>
- ベストアンサー
- JavaScript
- jqueryのロールオーバーについて
jqueryのロールオーバー設定に関してご質問です。 あるサイトのコーディングを行ってます。 サイト内のナビーゲーションボタンを瓶の画像でまとめてます。 各瓶の画像にリンクを付け、 マウスを乗せるとその瓶が開いた画像が 切り替わりでフェードインの感じで出てくるという設定を目指しているのですが、 うまくいきません。 色々やった結果マウスを当てると、 切り替わりで空いた瓶がフェードで出るのですが、 その画像奥に閉じた瓶がそのまま残ってて重なってる感じです。 こちらはどのようにすれば上手く画像奥の瓶は消えるのでしょうか？ ちなみに画像はpngです。 フェードの切り替わりは是非そのまま使用したいと考えてます。 あとマウスを外せばまた閉じた瓶がフェードで出るという感じを目指してます。 どなたかご教示いただいてもよろしいでしょうか？ 一応下記htmlとjsコードも載せておきます。 ▼html <script src="../lib/jquery1.8.1.min.js"></script> <script src="../js/jquery.tgImageRollover.js"></script> <script type="text/javascript"> jQuery(function(){ $(this).tgImageRollover({ selector : 'img.rollover', // セレクタ ←(7) attach : '_on', // ファイル名末尾句 ←(8) onFadeTime : 600, // カーソルON時のアニメーション時間 ←(9) offFadeTime : 400 // カーソルOFF時のアニメーション時間 ←(10) }); }); </script> <a href="#"><img class="rollover" src="../img/nav01.png" alt="" width="100" height="50"></a> <a href="#"><img class="rollover" src="../img/nav02.png" alt="" width="100" height="50"></a> ▼jquery.tgImageRollover.js ;(function($){ $.fn.tgImageRollover = function(options){ var opts = $.extend({}, $.fn.tgImageRollover.defaults, options); $(opts.selector).each( function(){ this.onImage = $(this).attr('src').replace(/^(.+)(\.[a-z]+)$/,"$1"+ opts.attach +"$2"); this.onHtml = $('<img src="'+this.onImage+'" alt="" style="position:absolute; opacity:0;">'); $(this).before(this.onHtml); $(this.onHtml).hover( function(){ $(this).stop().animate({'opacity': '1'}, opts.onFadeTime); }, function(){ $(this).stop().animate({'opacity': '0'}, opts.offFadeTime); } ) } ) } // default option $.fn.tgImageRollover.defaults = { selector : 'img.rollover', attach : '_on', onFadeTime : 600, offFadeTime : 400, }; })(jQuery);
- 締切済み
- JavaScript
- jQueryでホバーされていない要素を半透明にする
http://www.skuare.net/test/jopacity_show.html 下記のようにスクリプトがありますが、いまいちわかりません。 画像の場合 <li><img src=hoge.gif title="menu 1"></li>でよろしいのでしょうか？ <ul id="menu"> <li>menu 1</li> <li>menu 2</li> <li>menu 3</li> <li>menu 4</li> </ul> 「menu 1」にマウスオーバーされた際に、ほかの2-4が半透明になるイメージです。 まずはjQueryからjquery.jsをダウンロードします。 その後、以下のようなscriptを記述します。 <script type="text/javascript" src="jquery-1.3.2.js"></script> <script type="text/javascript"> $(document).ready(function() { $('#menu').children().hover(function() { //#menuの子要素にマウスオーバーした時の処理 $(this).siblings() //その要素の兄弟要素をすべて取ってきて .stop().fadeTo(500,0.5); //500ミリ秒かけて、opacity0.5まで変化させます }, function() { //マウスアウトの処理 $(this).siblings() .stop().fadeTo(500,1); //戻します }); }); </script>
- ベストアンサー
- JavaScript
- jqueryについて教えて下さい。
貴重な場をお借りして質問させていただきます。 知識のある方、お力を貸して下さい。 今勉強の為プラグインなどを制作しておりまして、 一定の値までスクロールするとコンテンツをフェイドインさせるような スクリプトを書いています。 ただ、別ページに遷移して戻ってくると、opacityが0となり真っ白な状態と なってしまいます。 それを解決するためにcookieなどを使ったりはして出来たのですが、 スマートではないので、cookieを使用せずに出来れば嬉しいのですが、 良い方法ございましたら、ご教示いただけないでしょうか。 宜しくお願い致します。 <script type="text/javascript"> $(function(){ $('#contents1').locationFade(); $('#contents2').locationFade(); $('#contents3').locationFade(); $('#contents4').locationFade(); }) </script> (function($) { $.fn.locationFade = function(options){ var defaults = { fadeSpeed:500, location:300, easing:'swing' } var opts = $.extend(defaults , options); var windowHeight = $(window).height(); var target = $(this); target.css('opacity',0);//最初に透明度0とする $(window).on('load' , function(){ //画像が読み込まれた後でないとtargetOffsetがきちんと取れない為 target.each(function(){ var targetOffset = target.offset().top; if(windowHeight > targetOffset){ //最初から要素がwindowサイズ内に表示されているなら即fadeIn target.stop().fadeTo(opts.fadeSpeed , 1 , opts.easing) } $(window).on("scroll", function(){ var scrollTop = $(window).scrollTop(); var scrollVol = scrollTop + windowHeight - opts.location; //locationはその要素のどれだけ上に来た時に表示するかの値 if(targetOffset <= scrollVol){ target.stop().fadeTo(opts.fadeSpeed , 1 , opts.easing) }; }); }); }); }; })(jQuery);
- ベストアンサー
- JavaScript
- jqueryについて
jqueryについて こんな内容のjqueryをひとつにまとめて、なおかつ01～99（実績数）までのidを割り振る設定したいのですが可能でしょうか？ 例えば $(function(){ $("#navi01-99 a").click(function(){ $("#main01-99 img").attr("src",$(this).attr("href")); return false; }); みたいな感じであとはidに番号を付ければいいみたいな・・・出来ませんでしょうか？ 用途は仕事の制作実績で使用したいのですが、どなたか教えていただけますでしょうか？ $(function(){ $("#navi01 a").click(function(){ $("#main01 img").attr("src",$(this).attr("href")); return false; }); }); $(function(){ $("#navi02 a").click(function(){ $("#main02 img").attr("src",$(this).attr("href")); return false; }); }); $(function(){ $("#navi03 a").click(function(){ $("#main03 img").attr("src",$(this).attr("href")); return false; }); }); $(function(){ $("#navi04 a").click(function(){ $("#main04 img").attr("src",$(this).attr("href")); return false; }); }); $(function(){ $("#navi05 a").click(function(){ $("#main05 img").attr("src",$(this).attr("href")); return false; }); });
- ベストアンサー
- AJAX
- JQueryを使ってcssを書き換え
何となくコードを見てさわる程度の初心者です。 以下のようなソースを組みました。 <div id="slide"> <a href="01.htm"><img src="01.jpg" alt="01" id="alttxt" /></a> </div> <div id="slidenavi"> <ul> <li><a href="01.html"><img src="s_01.jpg" alt="01" class="b_01.jpg" /></a><span class="active"></span></li> <li><a href="02.htm"><img src="s_02.jpg" alt="02" class="b_02.jpg" /></a><span class="active"></span></li> <li><a href="03.html"><img src="s_03.jpg" alt="03" class="b_03.jpg" /></a><span class="active"></span></li> </ul> </div> #slideがメインエリアで、#slidenaviがメインエリアの画像とリンク先を切り替えるナビゲーションボタンになっています。 ナビに連動したメインエリア用の画像ファイル名は #slidenavi の img の classに入れておいて、それを読み込んで代入するというおかしなやり方で呼び出していますが、ここまではうまくいきました。 問題はここからです。 最初の状態では<span class="active"></span>はcssの設定でdisplay: noneとしてあります。 そして#slidenaviのボタンにマウスが乗ると、その部分の<span class="active"></span>をdisplay: blockとして表示したいのですが、これがどうしてもうまくいきません。 この部分も含めて、おかしな書き方になっている部分があれば教えてもらえないでしょうか。 jsファイルは以下の通りです。 $(function(){ $('#slidenavi ul li a').fadeTo(0,0.4); $('#slidenavi ul li a').hover(function(){ $(this).fadeTo(300,1.0); }, function(){ $(this).fadeTo(300,0.4); }) $('#slidenavi ul li img').mouseover(function(){ var bglink = $(this).attr("class"); var altTxt = $(this).attr("alt"); $("#slide img").attr("src","images/home/main/"+bglink); $("#slide img").attr("alt",altTxt); $("#slide span.active").css("display","block"); }); $('#slidenavi ul li a').mouseover(function(){ var Href = $(this).attr('href'); var Tget = $(this).attr('target'); $("#slide a").attr("href", Href); $("#slide a").attr("target", Tget); $("#slide a").click(function() { window.open(Href,'_self'); return false; }); }); });
- ベストアンサー
- JavaScript
- jqueryで画像切り替え
この場をお借りして教えて頂ければ幸いです。 jqueryについて、今現在添付画像のようなサムネイルをマウスオーバーしますと、 メイン画像が切り替わるようなものをｊjqueryを使用して制作しました。 ここから、setIntervalを使用して画像が何もしなければ勝手に切り替わるように、 またマウスオーバーをしている際は切り替わらないように、そしてマウスアウトしたら そこの画像から順にsetIntervalが開始されるようにしたいと思っております。 そこの作業が出来ず困っておりまして、是非ともお教え頂ければと思います。 今現在のhtml , css , jsの方は記載しておきます。※reset.cssは除きます。 <body> <div id="wrap"> <div id="sec1"> <div id="photoBox"> <ul id="photo"> <li><img src="img/plan1.jpg" alt="食1" /></li> <li><img src="img/plan2.jpg" alt="食2" /></li> <li><img src="img/plan3.jpg" alt="食3" /></li> </ul> <ul id="thumb"> <li class="first"><img src="img/plan1_s.jpg" alt="" /></li> <li><img src="img/plan2_s.jpg" alt="" /></li> <li><img src="img/plan3_s.jpg" alt="" /></li> </ul> </div> </div> </div> </body> -------------------------------------------------------------------- div#wrap{ width:394px; margin:0 auto; } div#photoBox{ width:394px; height:391px; padding:40px 0; border-bottom:1px solid #CCC; } div#photoBox ul#photo{ width:394px; height:295px; padding-bottom:5px; position:relative; } div#photoBox ul#photo li{ width:394px; height:295px; display:block; position:absolute; top:0; left:0; } div#photoBox ul#thumb{ width:394px; height:91x; position:relative; } div#photoBox ul#thumb li{ float:left; padding-left:5px; } div#photoBox ul#thumb li.first{ padding-left:0; } --------------------------------------------------------- (function(){ var photo = $('#photo').find('li'); var thumb = $('#thumb').find('li'); photo.hide().eq(0).show(); thumb.hover(function(){ $(this).stop().fadeTo('fast', 0.6); photo.stop().fadeTo('fast', 0) .eq($(this).index()) .stop().fadeTo('fast', 1); }, function(){ $(this).stop().fadeTo('fast', 1); }); })
- ベストアンサー
- JavaScript
お礼
取得した要素(div)からその中の#photogallery a imgを除去することはできないということですね。。。 なるほど。。おっしゃっている意味はわかりますが何かこんがらがってきました（笑） ですが理解はできました！もしnotを使用した際に出来なかった場合はこのことを思い出してやってみます！ 解決するまでお付き合いくださいまして本当にありがとうございました。 またもし難題にぶつかった際は、どうぞ宜しくお願い致します。