jQuery hide/unhide 토글 이미지

작은 화살표를 클릭하여 표시하고 숨기는 div가 있습니다. 클릭하면 더 많은 정보를 펼칠 수있는 캘린더 항목입니다. 여태까지는 그런대로 잘됐다.jQuery hide/unhide 토글 이미지

"위로"에서 "아래로"상태로 변경하거나 내용이 표시 될 때 180도 더 잘 회전 할 수 있도록 콘텐츠를 숨김 해제 할 수있는 작은 화살표를 사용하고 싶습니다.

jQuery('.openheader').click(function() { 
    jQuery(this).parent().next().toggle('slow'); 
    return false; 
}).parent().next().hide();

.openheader 클래스는 화살표 이미지 주위의 링크에 적용됩니다.

나는 잘하고있는 반면에 .calendarhidden DIV (추가 정보가 들어있는 div)에 내용이 없으면 해당 링크 나 이미지를 숨길 수있는 좋은 기능이 될 것입니다.

어떤 아이디어가 있습니까? 그것을 토글 액션에 통합하는 방법에 대한 내 머리를 얻을 수 없습니다. 감사 * 편집 : 당신의 HTML 또는 jsFiddle을 게시 http://jsfiddle.net/marknolan/gtEdy/

출처

2012-11-16 Mark Nolan

: 여기 JS 바이올린입니다 도움이 될 것입니다. – j08691

j08691와 동의하십시오. 바이올린은 정확히 우리가 작업하고있는 것을 말해 줄 수 있습니다. 위에서 말한 것부터 CSS (배경 이미지)를 부서의 위쪽 화살표와 아래쪽 화살표로 변경하는 방법을 살펴볼 수 있습니다. 이를 위해 $ (this) .css ("background-image", ""); 그냥 생각. – ncf

좋은 생각 ... jsfiddle 감사에 그것을 설정할거야! http://jsfiddle.net/marknolan/gtEdy/ –

난 당신이이 말을해야하므로 if (document.getElementById(event.target.id).src.indexOf('right.png') > 0) { document.getElementById(event.target.id).src = 'path/arrow_left.png'; } else { document.getElementById(event.target.id).src = 'path/arrow_right.png'; }

편집과 같이이 작업을 수행 할 수 있다고 생각해야합니다 기능 (이벤트)

출처

2012-11-16 16:25:42 Constanta

감사합니다. –

jQuery hide/unhide 토글 이미지

답변

관련 문제