當一個div隱藏或可見時顯示不同的圖像

Question

我有一個小問題，我無法自己解決它。 我有一個圖像，當我點擊該圖像的div切換。 我希望當div被隱藏的圖像是一個向下的箭頭，當div可見的圖像是一個向上的箭頭。 我的HTML代碼：

​​

我對log_form CSS：

#log_form{ 
    margin-top:18px; 
    display: none; 
    min-height: 200px; 
    border: 1px solid #999999; 
    position: absolute; 
    top: 60px; 
    right: 0; 
    background: #788dbc; 
    z-index: 10; 
    -webkit-border-bottom-right-radius: 10px; 
    -webkit-border-bottom-left-radius: 10px; 
    -moz-border-radius-bottomright: 10px; 
    -moz-border-radius-bottomleft: 10px; 
    border-bottom-right-radius: 10px; 
    border-bottom-left-radius: 10px; 
    font-size: small; 
    min-height: 150px; 
} 

我的jQuery代碼：

$(document).ready(function(){ 
    $("#image_log").click(function(){ 
     $("#log_form").toggle(500); 
    }); 
}); 

因此，讓我們回顧一下：當頁面開始#log_form是隱藏的，#image_log src爲= "images/down.png"，點擊後#image_log，#log_form出現，我需要#img_log SRC是= "images/up.png"

Answer 1

$(document).ready(function(){ 
    $("#image_log").click(function(){ 
     $("#log_form").toggle(500,function(){ 
      if($(this).is(":visible")){ 
      $("#img_log").attr('src',"images/up.png"); 
      } 
      else{ 
      $("#img_log").attr('src',"images/down.png"); 
      } 
     }); 
    }); 
}); 

Answer 2

你剛纔設置的IMG SRC新文件：

$("#image_log[src='down.png']").click(function() { 
    $(this).attr("src","up.png") 
}) 

Answer 3

嘗試這種方式

$(document).ready(function(){ 
    $("#image_log").click(function(){ 
     $("#log_form").toggle(500); 
     $(this).attr('src', 
        $("#log_form").is(":visible") 
         ? 'images/up.png' 
         : 'images/down.png'); 
    }); 
});