2010-05-08 3 views
0

저는 jquery에 특히 html을 처음 사용합니다. 그러나 나는 클릭하여 사진을 숨기고 싶습니다. 필자가 원하는 샘플 코드를 가져 왔습니다. 이 코드을 작성하지 않았으며 div 대 이미지 코드를 수정하려고합니다. 아래에 코드가 나와 있습니다.Jquery 이미지 표시 방법 숨기기

나는이 여러 가지 방법과 내 목표 시도 :
1. 어떤 도움이 멋진 것

div 태그 대 이미지를 숨기려면을

<!DOCTYPE html> 
<html> 
<head> 
    <style> 
    div { background:#def3ca; margin:3px; width:80px; 
    display:none; float:left; text-align:center; } 
    </style> 
    <script src="http://code.jquery.com/jquery-latest.js"></script> 
</head> 
<body> 

    <button id="showr">Show</button> 
    <button id="hidr">Hide</button> 
    <div>Hello 3,</div> 

    <div>how</div> 
    <div>are</div> 
    <div>you?</div> 
<script> 
$("#showr").click(function() { 
    $("div:eq(0)").show("fast", function() { 
    /* use callee so don't have to name the function */ 
    $(this).next("div").show("fast", arguments.callee); 
    }); 
}); 
$("#hidr").click(function() { 
    $("div").hide(2000); 
}); 

</script> 
</body> 
</html> 

<button id="showr">Show</button> 
<button id="hidr">Hide</button> 

<div id="div">Test</div> 

답변

1

이미지의 경우 divimg으로 변경하십시오 (또는 div에 이미지를 고정하고 스크립트에서 아무 것도 변경하지 않아도됩니다. 같은 : 스크립트의

$("#showr").click(function() { 
    $("img:eq(0)").show("fast", function() { 
    $(this).next("img").show("fast", arguments.callee); 
    }); 
}); 
$("#hidr").click(function() { 
    $("img").hide(2000); 
}); 

div 부분이 <img> 태그를 원하기 때문에, 위에서처럼 스왑 단지 수있다 "일치 <div> 태그"라고했다. 또한, 내가 다른 것에서 가져온 것 같아/큰, 그 경우에 당신은 아마 , arguments.callee 부분을 제거 할 수 있습니다,하지만 난 100 % 확실하지 않아, 그것이 무엇을 해야하는지에 따라 다릅니다.

+0

감사합니다. 이미지가 4 개인 경우 수업에 어떻게 보이게할까요? – Michael

+0

@Michael -이 경우'img'을'img.myClass'로 변경하면'' 요소와 일치합니다. 여기 몇 분 안에 선택기를 읽을 시간이있는 좋은 소개가 있습니다. http://docs.jquery.com/Tutorials:Getting_Started_with_jQuery#Find_me:_Using_selectors_and_events –

+0

@ Nick - 이런 종류의? LesPaul Michael