내 웹 사이트의 애니메이션 슬라이더를 만들려고하는데 슬라이더의 요소를 배치하기 위해 수레와 여백을 사용하고 있습니다. 슬라이더에 통합하여 요소를 애니메이션으로 만들 수있는 것을 검색하고있었습니다. CSS3 전환을 사용해야하고 그 요소가 부모 내부에 절대적으로 배치되어야한다는 점이 문제입니다. 요소를 배치하는 방식과 요소의 크기가 다양하기 때문에 요소를 절대 배치하지 않으려합니다.슬라이더 요소가 절대 위치에 있지 않은 경우이를 애니메이트하는 방법은 무엇입니까?
위치 절대 값을 사용하지 않고 이러한 요소를 어떻게 애니메이트하거나 전환 할 수 있습니까? 각기 다른 길이와 방향으로 각 요소를 다르게 애니메이트하려고합니다.
및 감사합니다.
UPADTE : 나는로 WooThemes Flexslider을 사용하고
당신 수있는
'+=10px' or '-=10px'
그래서 추가하거나 상태로하지 않고도 애니메이션을 적용 할 elemnt의 값을 감소 CSS에 자바 스크립트를 통해 광고 결과의 정확한 양. 이
편집
또한 어떤 자바 스크립트
을 사용하여 로직을 코딩 할 수 있습니다. '+ = 10px'또는 '- = 10px'란 무엇을 의미합니까? 키 프레임은 절대적으로 요소를 배치하지 않고도 작동합니까? – Pierre
나는 elemnt가 이미 가지고있는 숫자를 증가 시키거나 감소 시킨다는 것을 의미한다. 그렇다. –
사용 transform: translate(x,y)없이 @keyframes이를 사용할 수 있습니다 도움이되기를 바랍니다. 변형은 주변 마크 업/스타일 (예 : position: absolute)과 독립적이며 모바일 장치에서도 하드웨어가 가속화됩니다.
jQuery를 사용하는 경우 DOM 요소의 모든 속성을 .animate()으로 수정할 수 있습니다. 즉, 요소의 여백과 패딩을 상대적 위치로 유지할 수 있습니다.
마크 업 예제 제공 http://jsfiddle.net/ – kidwon
여백 속성 –