jQuery的 - 在同一時間

Question

我用四個DIV的改變更多的背景，看起來如下：

<div class"first">1</div> 
<div class"second">2</div> 
<div class"third">3</div> 
<div class"fourth">4</div> 

如果光標在「第二」 DIV，該DIV的背景應該改變以及前一個div的背景（「第一個」）。另外，如果光標懸停在「第三個」DIV上，則前一個（「第一個」和「第二個」）應該改變背景顏色。如果光標位於div的「第四」位置，則前三個DIV（「第一個」，「第二個」和「第三個」）應該改變背景。

我該如何使用jquery？

Answer 1

=== EDITED ===

的jsfiddle：http://jsfiddle.net/sw9YV/10/

試試這個網站：

<div id="group1"> 
    <div class="first hoverMe">1</div> 
    <div class="second hoverMe">2</div> 
    <div class="third hoverMe">3</div> 
    <div class="fourth hoverMe">4</div> 
</div> 
<br /><br /><br /> 
<div id="group2"> 
    <div class="first hoverMe">1</div> 
    <div class="second hoverMe">2</div> 
    <div class="third hoverMe">3</div> 
    <div class="fourth hoverMe">4</div> 
</div>​ 

和這個js：

$(".hoverMe").mouseover(function(){ 
    $(this).css("background-color","#d3d3d3"); 
    $(this).prevAll(".hoverMe").css("background-color","#d3d3d3"); 
}); 

$(".hoverMe").mouseout(function(){ 
    $(this).css("background-color",""); 
    $(this).prevAll(".hoverMe").css("background-color",""); 
}); 
​ 

Answer 2

我建議如下：

$('div').hover(
function(){ 
    $(this).prevAll().css('background-color','#f00'); 
}, 
function(){ 
    $(this).prevAll().css('background-color','#fff'); 
}); 

JS Fiddle demo。

請注意，您的HTML需要在class和"first"（etc）之間的=。