2010-05-08 105 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

對於圖片,只需將div更改爲img(或將圖片粘貼在div中,並且不更改腳本中的任何內容,無論您的船是否漂浮),像這樣:

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

div部分的劇本都在說「比賽<div>標籤」,因爲你想<img>標籤,你可以換出來像上面。此外,我猜這是從其他/更大的東西中獲得的,在這種情況下,您可能會刪除, arguments.callee部分,但我不是100%確定的,取決於它應該做什麼。

+0

謝謝,如果有4張圖片,我想讓它上課怎麼樣? – Michael 2010-05-08 14:56:02

+0

@Michael - 在這種情況下,將'img'改爲'img.myClass',這會匹配''元素。有一個很好的介紹值得花時間在這裏閱讀選擇器,如果你有幾分鐘:) http://docs.jquery.com/Tutorials:Getting_Started_with_jQuery#Find_me:_Using_selectors_and_events – 2010-05-08 15:00:03

+0

@尼克 - 有點像這樣? LesPaul Michael 2010-05-08 15:13:15