2010-05-25 7 views
1

초보자 용 질문은 여기에 있습니다. 그 위에 마우스를 올리면 이미지를 변경하는 데 사용되는 Jquery 함수를 만들려고합니다. 나는 ID 이름을 선택자로 사용한다. 롤오버 이미지가있는 모든 단일 태그에 대해 기능 사본을 가질 필요가 없도록 일반화하려면 어떻게해야합니까?Jquery로 롤오버 이미지

$("#home img").hover( 
     function(){ 
      blah 
     }, 
     function(){ 
      blah 
     } 
); 
+0

당신은 또한 몇 가지를 포함 할 수 있습니다 거기에 HTML ... – Reigel

답변

3

js없이 롤오버를 수행 할 수 있습니다 (IE6과의 호환성이 필요하지 않는 한).

HTML :

<div class="imgHover"> 
    <img class="default" src="..."> 
    <img class="roll" src="..."> 
</div> 

CSS : 당신이 IE6과의 호환성을 필요로하는 경우

.imgHover .roll { 
    display: none; 
} 

.imgHover:hover .roll { 
    display: block; 
} 

.imgHover:hover .default { 
    display: none; 
} 

,이 (하지만, 그것은 안된의) 작동합니다 :

$('.imgHover').hover( 
    function() { 
     $('.default', $(this)).hide(); 
     $('.roll', $(this)).show(); 
    }, 
    function() { 
     $('.default', $(this)).show(); 
     $('.roll', $(this)).hide(); 
    } 
} 
0

당신이 (간단하고 rollover 같은 의미) 클래스와이 작업을 수행하고 $(".rollover")으로 선택하고자하는 이미지를 부여합니다. 그것은 당신이 HTML을 제어한다면, 거기있는 모든 것이되어야합니다.