jQuery animate()가 작동하지 않지만 css()가

일부 슬라이딩 패널 (아코디언)을 만들고 배경 이미지를 슬라이드하여 배경 조각이 항상 표시되도록하려고합니다. 패널에 애니메이션을 적용하는 데 문제가 있지만 CSS는 정상적으로 작동합니다. 예컨대는 : jQuery animate()가 작동하지 않지만 css()가

if(slideIndex == index) { 
    $this.children('.heading').children().children().fadeIn(settings.slideSpeed); 
    $this.children('.heading').animate({height: 250}); 
} else { 
    $this.children('.heading').children().children().not('.panel-strip').fadeOut(settings.slideSpeed); 
    $this.children('.heading').animate({height: 500}); 
}

이 작동하지 않습니다,하지만 난 animate 대신 css으로 대체 할 경우 작동합니다.

HTML은 내가 액세스하려고 시도하는 <div class="panels-background heading">입니다.

자바 스크립트는 liteAccordion에서 변경되었습니다.

jsFiddle : http://jsfiddle.net/beaverusiv/GGd38/4/ 해당 지역의 자바 스크립트에서 'CODE'를 (를) 검색하십시오.

출처

2012-03-27 BeaverusIV

$ this.children ('. heading'). children(). children) .not ('. panel-strip')'... ... mmm ... 더 나은 선택기가 있어야합니다. – elclanrs

골드 스타를 찾을 수 있다면 :) – BeaverusIV

html을 게시 하시겠습니까? – elclanrs

문제는 바로 호출되는 코드 블록 아래 :

$this 
    .children('.heading') 
    .stop(true) 
    .animate({ 
      left : (side ? 0 : slideWidth) + slideIndex * settings.headerWidth 
     }, 
    settings.slideSpeed, 
    settings.easing, 
    function() { 
     // flag ensures that fn is only called one time per triggerSlide 
     if (!core.slideAnimCompleteFlag) { 
      settings.onSlideAnimComplete.call(next); 
      core.slideAnimCompleteFlag = true; 
     } 
    });

당신이 당신이 전에 전화를하려고하는 높이 애니메이션을 중지하고 .stop() 전화

출처

2012-03-27 03:48:20

감사합니다. 이제는 애니메이션을 실행하여 부드럽게 실행시켜야합니다. – BeaverusIV

여러분을 환영합니다! –

한 번 비슷한 문제가있었습니다. jQuery를 사용할 때 애니메이션 속성이 제안 된대로 작동하지 않는 것처럼 보였습니다. 약간의 연구가 있었지만, 직감적으로 jQuery UI 라이브러리를 추가했습니다. 그리고 효과가있었습니다. 마지막에는 jQuery UI Effect 라이브러리 파일이 포함되어 있으며 지옥처럼 작동했습니다.

문서 (http://docs.jquery.com/UI/Effects/animate)에서는 UI 효과 라이브러리가 색상을 지원하는 애니메이션 기능을 확장하지만 나에게는 높이 애니메이션에도 도움이된다고합니다. 이유는 ..

이 고토를 다운로드하려면 http://jqueryui.com/download 하단에 코어 및 UI 효과를 선택하십시오. 나머지를 선택하지 않습니다 (약 8kb 파일에서 솔루션을 수신하려면). 그런 다음 zip 파일을 다운로드로 받게됩니다.

이 zip에서 goto js 디렉토리; jquery-ui-1.8.18.custom.min.js와 같은 이름의 파일을 선택하여 페이지에 추가하십시오. 나는 이것이 할 것이라고 생각한다. 다시 슬라이드, 상자, 폭발 등의 더 차가운 효과를 추가 할 수 있습니다. 추가 지침이 필요하지 않을 것 같아요. gud day :)

출처

2012-03-27 04:59:24

jQuery animate()가 작동하지 않지만 css()가

답변

관련 문제