경계 반경 애니 메이팅을위한 jQuery

Question

border-top-left-radius 스타일 애니메이션에 문제가 있습니다. 두 개의 길이 값을 따로 입력하여이 스타일을 사용합니다.

border-top-left-radius: 15px 25px; 

내가 jquery.animate()를 통해 별도로이 두 길이 값을 증가 싶습니다.

이 방법이 있습니까?

Answer 1

border-left-radius는 하나의 값만 허용합니까? 그래서 당신은 좋아하는 애니메이션 것 :

$('.class').animate({borderTopLeftRadius: 20}) 

편집 확실하지

---

를 jQuery를이 상자 밖으로이 supporst합니다.

$('#container').animate({ 
    borderTopLeftRadiusSideLength: 500, 
    borderTopLeftRadiusUpperLength: 50 
}, { 
    duration: 5000, 
    step: function (val, context) { 
     $(this).data(context.prop, val); 
     var side = $(this).data('borderTopLeftRadiusSideLength'); 
     var upper = $(this).data('borderTopLeftRadiusUpperLength'); 
     if (side && upper) { 
      $(this).css('borderTopLeftRadius', side + 'px ' + upper + 'px'); 
     } 
    } 
}); 

http://jsfiddle.net/YWsQn/1/