2014-10-19 5 views
-1

내 테이블에서 행을 클릭하고 싶습니다. 행을 클릭하면 위아래로 확장됩니다. 확장 된 내용을 표시하려면 선택한 행에 상대적 위치와 높은 Z- 색인이 필요합니다.setTimeout 더블 클릭 문제

행을 다시 축소하면 다른 행보다 뒤쳐져 더 높은 z- 인덱스와 위치 설정을 지체시켜야합니다.

나는 .delay로 플레이했는데 CSS 기능이 아닌 애니메이션 기능 만 적용하는 것 같습니다. 나는 CSS 함수에 대기열을 사용했지만 그것도 작동하지 못했습니다.

가장 가까운 성공을 얻으려면 아래 코드를 따르십시오. 그러나 어떤 이유로 클릭 한 번으로 클릭하지 않고 행을 접으려면 두 번 클릭해야합니다. 나는 무엇을 잘못 했는가? 고마워요

$(".expanding").toggle(
    function(){ 
     $(this).animate ({ 
      'z-index': '9999', 
     }, 1) 
     $(this).css({ position: 'relative'}); 
     }, 
     function() { 
     $(this) = setTimeout((function() { 
      $(this).animate ({ 
       'z-index': '0',  
      }) 
      $(this).css({ position: 'static'}); 
     }), 500); 
    }); 

EDIT; 또한 누구나 언급하기 전에이 섹션에 toggleClass를 사용할 수 없습니다.

EDIT2 : @charlietfl이 지적했습니다. "setTimeout 내부에서 this가 요소의 컨텍스트를 잃습니다.".. 내가 재설정하고 내 문제를 해결했습니다.

+4

'$ (this) = setTimeout (...);'무엇을 기대합니까? –

+1

http://jsfiddle.net을 설정하여 직접 시도해 볼 수 있습니까? – Niklas

+1

'toggle (Fn, Fn)'은 더 이상 사용되지 않습니다. jQuery의 어떤 버전을 사용하고 있습니까? setTimeout 내부의'this'는 엘레멘트 문맥을 잃는다. – charlietfl

답변

0

@charlietfl as out .. "이 'setTimeout 내부에서 요소의 컨텍스트를 잃습니다.".. 나는 그것을 재설정하고 내 문제를 해결했습니다.