CSS/JQuery border

Question

以下のjqueryコードは、ホバー上で行ってもらいたいものです。ただし、次のように動作する必要があります。

ユーザーが#altimgXの上を移動すると（たとえば）黒い境界線が表示されます。私はこの境界線を '#altimgY'が浮かび上がるまで残しておきたい。その時点で#altimgXから境界線を削除したいと考えています。

私は 'mouseleave'を使ってみましたが、現在の#altimg境界線を別の#altimg要素が浮かび上がるまで保持したいので、これは私の問題を解決しません。

$("#altimg0, #altimg1, #altimg2, #altimg3, #altimg4, #altimg5").hover(function(){ 
     $(this).css('border', '3px solid black'); 
});  

HTMLコードスニペット

<div id="altimg0" style="height:70px; width:70px;"> SOME IMAGE </div> 
<div id="altimg1" style="height:70px; width:70px;"> SOME IMAGE </div> 
<div id="altimg2" style="height:70px; width:70px;"> SOME IMAGE </div> 
<div id="altimg3" style="height:70px; width:70px;"> SOME IMAGE </div> 
<div id="altimg4" style="height:70px; width:70px;"> SOME IMAGE </div> 
<div id="altimg5" style="height:70px; width:70px;"> SOME IMAGE </div> 

は、私は任意のヘルプこの点で任意の助けを感謝しています。

は、要素ごとにホバー機能で

Answer 1

var altimgs = $("#altimg0, #altimg1, #altimg2, #altimg3, #altimg4, #altimg5"); 

altimgs.hover(function() { 
    altimgs.css('border-width', '0'); 
    $(this).css('border', '3px solid black'); 
}); 

ありがとう、あなただけの唯一の希望の1のためにそれを設定し、その後、最初の境界を削除する必要があります。

また、フィドル：すべてのhttp://jsfiddle.net/EYgpj/

Answer 2

まず、あなたはおそらく、クラスではなく、IDに基づいて要素を選択する必要があります。

$(".altimg").hover(function() { 
    //Remove border from all altimg classes 
    $(".altimg").css('border','0px'); 
    //Set the border for this element. 
    $(this).css('border','3px solid black'); 
} 

Answer 3

は現在、ホバー要素を格納する変数を作成します。 。これらの値にアクセスするには、おそらくクラス参照を使用する必要があります。 ex $（ "。altImg"）。

var currentHover = ''; 
$("#altimg0, #altimg1, #altimg2, #altimg3, #altimg4, #altimg5").hover(function(){ 

    $(this).css('border', '3px solid black'); 

    if (currentHover != '') 
    { 
     $("#" + currentHover).css('border', '0px'); 
    } 

    currentHover = $(this).attr('id'); 

}); 

Answer 4

次に、あなたのコード

$(document).ready(function(){ 

    $("hoverimage").hover(function() { 

     // Remove border for all images 
     $("over").removeClass("over"); 

     // Add border to this image 
     $(this).addClass("over"); 
    }); 
});