2011-09-02 4 views
0

간단한 차트 생성기를 개발할 계획입니다.jQuery - 이론적 인 차트 애니메이션

80 %는 jQuery를 기반으로합니다. 경험이 많은 jQuery 사용자의 답변을 찾고 있습니다.

내 애니메이션을 기반으로합니다 :

  • jQuery를
  • CSS
  • 배경 이미지 기본적으로

을, jQuery를 종종 애니메이션 efect에도를 만들 수있는 CSS를 조작 할 수 있습니까?

예 : 애니메이션을 만들 때마다 배경 위치를 2ms마다 변경 하시겠습니까?

E.G. '왼쪽 상단'에서 '오른쪽 상단'으로 배경 위치를 변경하지만 px는 px 기반으로 변경 하시겠습니까?

이런 종류의 사용법을 본 적이 있습니까?

모든 예제, 제안, 기술 사례가 많이 감사하겠습니다.

+0

학술 활동에만 국한되는 것이 아니라면 바퀴의 재발생을 신경 쓰지 마세요. http://code.google.com/p/flot/을 확인하십시오. –

+0

@Matt, 내 차트는 백분율을 보여주는 사각형입니다 (모든 요소에 대한 배경 = 100 %, 배경이 반 이상 = 50 % 등). 귀하의 예는 더 많은 사전 사용을위한 것입니다. – Iladarsda

답변

1

jQuery의 애니메이션은 set the speed입니다.
각 호출 전에 to clear 애니메이션 스택을 권하고 싶습니다.

+0

jQuery docs :'.animate() 메서드를 사용하면 숫자로 된 CSS 속성에 애니메이션 효과를 생성 할 수 있습니다.'- background position top left = 0px 0px', 그래서 numeric. 하지만 먼저 '꼭대기 오른쪽'에 숫자를 다시 사용하는 것보다 먼저 요소 너비를 계산해야 할 것 같습니다. 이게 올바른가, 아니면 정상 맨위, 오른쪽 위가 숫자만큼 좋은가요? – Iladarsda

+0

다음은 [jquery background animation plugin]입니다. (http://www.protofunc.com/scripts/jquery/backgroundPosition/) 숫자 또는 텍스트 사용 정보 - 사용자가 수행 할 작업에 따라 달라집니다. – yzk

1

jQuery는 애니메이션 잘 : see the docs.

모두에 애니메이션을 적용 할 수 없습니다. 고급 CSS 애니메이션을 수행해야하는 경우 jQuery UI과 함께 제공되는 효과를 사용해야합니다.

+0

JQuery UI가 없습니다. 'background-image/background-position' 애니메이션. 내가 찾고 있던 하나 :) 그 포트 - 완벽한 솔루션. – Iladarsda

+0

@NewUser jQuery UI는 임의의 CSS 클래스간에 애니메이션을 적용 할 수 있으므로 AFAIK을 수행 할 수 있어야합니다. – Skilldrick

+0

@NewUser 사실 당신 말이 맞아요, jQuery UI는'background-position'을 움직이지 않을 것입니다. http://jsfiddle.net/skilldrick/KEJU6/1/ – Skilldrick

1

참조 :도

http://www.protofunc.com/scripts/jquery/backgroundPosition/ 

참조 :

몇 가지 배경의 애니메이션 효과를 나열
http://sixrevisions.com/javascript/10-awesome-techniques-and-examples-of-animation-with-jquery/ 

.