2012-07-26 3 views
0

'오른쪽'속성을 px 값에서 percent 값으로 변경하려고하면 jquery-ui switchClass에서 수행 한 애니메이션에 문제가 있습니다. 이 문제는 Chrome에서만 발생합니다 (FireFox 또는 IE에서 작동).jquery-ui switchClass가 Chrome에서 실패합니다.

애니메이션은 div의 오른쪽 속성을 '90px'에서 '20 % '로 변경해야하지만 div는 먼저 화면의 다른 부분으로 이동합니다. 디버거 도구를 살펴보면 px는 %로 해석되는 것 같습니다. 값의 시퀀스는 90px, 89 %, 88 %, ... 21 %, 20 %입니다.

다음 코드는 문제가 재생하기 :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
     <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.21/jquery-ui.min.js"></script> 
     <style> 
      .class1 {width:100px; height:50px; position:absolute; right:90px; background-color:#F9EDBE;} 
      .class2 {width:100px; height:50px; position:absolute; right:20%; background-color:#F9EDBE;} 
     </style> 
    </head> 
    <body> 
     <div id="myDiv" class="class1" onclick="$('#myDiv').switchClass('class1', 'class2', 5000);">Click me</div> 
    </body> 

감사를 사전에 도움을.

답변

0

jQuery 선택기 대신 'this'를 사용해 볼 수 있습니다. 또한 'name'속성을 'id'와 동일한 값으로 추가하십시오.

+0

셀렉터가 요소를 올바르게 찾고 switchClass가 호출되었습니다. 문제는 div가 첫 번째 위치에서 두 번째 위치로 부드럽게 진행되는 대신 화면의 다른 부분으로 이동한다는 것입니다. – user1553928