2012-07-23 6 views
1

우선 혼란스러운 제목에 대해 사과드립니다. 나는 jQuery에서 어리석은 문제를 겪고있다. 내 코드는 다음과 같습니다.jQuery 변수 및 실행 지연

$j('.parent').hover(function(){ 
    var newWidth = $j(this).find('img').length * 70; // I need number of images within parent and multiply it by 70 
    $j(this).stop().animate({'width':newWidth},700); // <-- This does not work 
}, function(){ 
    $j(this).stop().animate({'width':'70'},700); // Back to original width 
}); 

하지만 애니메이션이 없습니다. newWidth에 경고하면 정답이됩니다. 값이 newWidth에 할당되는 동안 애니메이션이 동시에 실행되고 따라서 아무 일도 발생하지 않는다고 생각합니다. 변수 할당과 애니메이션 실행 사이에 지연을 추가해야합니까? 또 다른 효율적인 방법이 있습니까?

UPDATE는 다음 .parent의 CSS는 인라인이며 다음입니다 :

변경하고자 할 폭
element.style { 
background-color: #000000; 
border-color: #CCCCCC; 
border-radius: 0 0 0 0; 
border-style: solid; 
border-width: 0; 
clear: both; 
height: 75px; 
overflow: hidden; 
padding: 0; 
position: relative; 
width: 70px; 
} 
+1

비동기 아니기 때문에 지연이 필요하지 않습니다. 어떤 종류의 요소가'.parent' 클래스를 가지고 있으며 클래스에 대한 CSS를 제공 할 수 있습니까? – MrOBrian

+0

'parent'클래스의 요소는 DIV입니다. 저는 .parent의 CSS를 추가했습니다. CSS는 동적이며 DIV 자체에서 인라인입니다. – JMDee

+0

그래서 그 모든 CSS는 div에있는 스타일 태그에 있습니다. (그것은 나를 겁나게 만들지 만, 좋아요), "부모"클래스의 스타일은 어떻습니까? Wouter J가 보여 주듯이 코드가 작동하기 때문에 애니메이션을 만들 수 없다면 분명히 다른 일이 발생합니다. – MrOBrian

답변

0

? .parent 너비 또는 .parent img 너비? this 요소의 너비는 .parent입니다. 그래서 그것은 이미지를 움직이지 않을 것입니다.

그리고 코드가 잘 작동 : 변수를 설정 http://jsfiddle.net/WouterJ/QvmBa/

+0

예 '.parent'의 너비를 변경하고 싶습니다. 질문에 몇 가지 세부 사항을 추가했습니다. – JMDee

+0

@JMDee 그럼 jsfiddle이 보여준대로 잘 작동합니다. –

+0

나는 작동합니다. 이 특정 스크립트는 setTimeout 함수 안에있었습니다. 타임 아웃이 늘어 났고 작동이 시작되었습니다. – JMDee