別のものにカーソルを置いたときに特定のdivをターゲットにする

Question

私は1つのdivにカーソルを置いて、divのホバー状態をトリガーするだけでなく、ページ上の他の場所にdivを置くようにします。これどうやってするの。 JavaScriptまたはJQueryを使用すると問題ありません。私はクラス「の詳細・ラップ」とDIVをロールオーバーし、クラス「ボトム詳細ラップ」とdiv要素にhoverstateをトリガするために探しています

<div class="wrapper"> 
       <div class="col-left-3"> 
       <a href="http://example.com"> 
         <div class="details-wrap"> 
          <h3>Title</h3> 
          <p>Description</p> 
         </div> 
       </a> 
       </div> 

       <div class="col-left-3"> 
       <a href="http://example.com"> 
         <div class="details-wrap"> 
          <h3>Title</h3> 
          <p>Description</p> 
         </div> 
       </a> 
       </div> 

       <div class="col-left-3"> 
       <a href="http://example.com"> 
         <div class="details-wrap"> 
          <h3>Title</h3> 
          <p>Description</p> 
         </div> 
       </a> 
       </div> 


       <div class="full-width-col"> 
       <a href="http://example.com"> 
         <div class="bottom-details-wrap"> 
          <h3>Title</h3> 
          <p>Description</p> 
          <div class="full-width-column-container"> 

           <div class="col-left-3-res"> 
            <h3>Col 1 title</h3> 
            <ul> 
             <li>List Item</li> 

             <li>List Item</li> 
            </ul> 
           </div> 

           <div class="col-left-3-res"> 
            <h3>Col 2 title</h3> 
            <ul> 
             <li>List Item</li> 

             <li>List Item</li> 
            </ul> 
           </div> 

           <div class="col-left-3-res"> 
            <h3>Col 3 title</h3> 
            <ul> 
             <li>List Item</li> 

             <li>List Item</li> 
            </ul> 
           </div> 


          </div> 
         </div> 
       </a> 
       </div> 
       </div> 

：ここのように私のコードが見えるものです。ご覧のとおり、これらは他のdivの内部にあるので、私はCSSだけでなくJavascriptを使用してターゲットを設定する必要があると考えています。しかし、私はそれをどうやって行うのか分かりません。どんな助けも役に立つでしょう。

Answer 1

jQueryで.hover（）関数を使用できます。

JSFIDDLE

$('element').hover(function() { 
 
     //do what you want to elements here. 
 
    } 
 
);

jQueryので

Answer 2

あなたは$('.details-wrap')に.hover()方法を適用した場合、あなたはその後、$('.bottom-details-wrap')にエフェクトを適用する機能を追加することができますの

$(document).ready(function(){ 

    $('.details-wrap').hover(function(){ 
     $('.bottom-details-wrap') [...rest of function here...] 
    }); 

});