jQuery 디스플레이 CSS로 인한 이미지 변경

Question

.slidingDiv의 CSS 사실에 대한 이미지를 변경하려고합니다.

$(document).ready(function(){ 
    var a = $('.slidingDiv').css({'display':'none'}); 
    var b = $('.slidingDiv').css({'display' : 'table-row'}); 

    if (a > b) { 
     a.find('.imgchange img').attr('src','http://illiweb.com/fa/m/tabs_less1.gif'); 
    } else if (a<b){ 
     $('.imgchange img').attr('src','http://illiweb.com/fa/m/tabs_more1.gif'); 
    } 
});​ 

사람이 내가 잘못 뭐하는 거지 설명 할 수 : 이것은 내가 지금까지 가지고있는 코드는?

편집 : 내가 사업부가 (display:none;)를 폐쇄하는 경우 나타나는 tabs_more1.gif를 만들기 위해 노력하고 그들이 div의 열고 닫습니다 (display:table-row;

코드 열려있는 경우 tabs_less1.gif이 나타납니다

$(document).ready(function() { 
    $(".slidingDiv").hide(); 
$('.secondarytitle').click(function() { 
    $(this).closest('tr').siblings('.slidingDiv').slideToggle(); 
}); 
    }); 

Answer 1

을

.slidingDiv의 가시성 테스트

코드에서 a 및 b은 jQuery를 반환합니다. 엘프, 숫자가 아니야. jQuery.fn.css 두 개의 인수 또는 첫 번째 인수로 객체를 전달하면 CSS가 두 번째 인수의 문자열 값 또는 객체의 값으로 설정됩니다. slidingDiv 요소를 숨기고 너무 빨리 다시 눈에 보이지 않을 것입니다. jQuery가 반환되므로 chain methods을 함께 사용할 수 있습니다.

에 따라 수행하려는 작업은입니다.

뒤에 의 이미지를 변경하려면 코드에서 slideToggle의 두 번째 인수로 콜백 함수를 제공하십시오. .slidingDiv이 슬라이딩/애니메이션을 멈 추면 실행되는 함수입니다. 함수 내에서 그 후에 원하는 것을 확인할 수 있습니다. div가 완전히 표시되거나 완전히 숨겨지고 jQuery가 현재 적용된 CSS 스타일을 .slidingDiv으로 올바르게 평가할 것임을 보증합니다. 당신이 전에 이미지 을 변경하려면

$(document).ready(function() { 
    $(".slidingDiv").hide(); 
    $('.secondarytitle').click(function() { 
     $(this).closest('tr').siblings('.slidingDiv').slideToggle(undefined, changeImage); 
    }); 
}); 

function changeImage() { 
    var slidingEl = $('.slidingDiv'), 
     isVisibleBool = slidingEl.is(':visible'), 
     imgToChangeEl = $('.imgchange img'); 

    if (true === isVisibleBool) { 
     imgToChangeEl.attr('src','http://illiweb.com/fa/m/tabs_less1.gif'); 
    } else { 
     imgToChangeEl.attr('src','http://illiweb.com/fa/m/tabs_more1.gif'); 
    } 
} 

는 slideToggle 호출하기 전에 changeImage 전화를했습니다. 다른 날 콜백 함수를 저장할 수 있습니다. 그러나 hide은 매개 변수로 콜백 함수를 허용합니다. 두번째는 첫번째가 무엇 겹쳐 지도록

Answer 2

우선

var a = $('.slidingDiv').css({'display':'none'}); 
var b = $('.slidingDiv').css({'display' : 'table-row'}); 

이 두 라인은 동일한 요소를 대상.

---

다음은 (a > b)입니다. 이걸로 뭘 기대하니? 당신은에서

---

(이 순간에서 같은 내용 )를 두 JQuery와 객체를 비교하는 else 당신은

('.imgchange img'). 

당신은 ..

을 시작시 $ 누락 것 같다 할