jquery .animate通過％of object X或Y

由於IE和世界其他地方之間的一些CSS限制，我不得不使用.animate作爲％而非px或objectToMove跳轉（僅限IE），然後使用動畫。jquery .animate通過％of object X或Y

因此，如果下面是使用

$('.myClick').click(function() { 
    $('.objectToMove').animate({ 
    top: '+=10%' 
      }, 'fast', function() { 
    // Animation complete. 
    }); 
});

它將由屏幕高度的10％移動objectToMove。我想將它移動爲objectToMove高度的10％。

這是可能的，而不必得到屏幕和對象的高度，並找出屏幕高度等對象的百分比？

例如

畫布大小= 720像素

objectToMove = 100px的

我想通過10px的不72px

THX 藝術移動objectToMove

來源

2012-06-22 art vanderlay

澄清所需的百分比高度，可以說是.objectToMove 500像素，是你想製作動畫50像素？（對象高度的10％） –

@AaronMiler，這是正確的地方，畫布大小是說720px objectToMove是100px我想移動對象10px而不是72px –

你可以得到'+ ='+（$（'。objectToMove'）） .height（）/ 100）* 10？ –

以簡單的方式，

與

top: '+=' + ($('.objectToMove').height()/100) * 10;

可以獲取物體

來源

2012-06-22 06:25:58

這裏是我的有。如果你被迫繼續按百分比工作，這應該工作。

要開始我要獲取元素和HTML的高度。

var moveObject = $('.objectToMove').height(); 
var html = $('html').height();

然後我會找出移動它自己的高度的對象10％是

var distance = (moveObject/html)*10;

現在，我要移動的對象10％的它的高度，從頂端。

$('.objectToMove').animate({ 
    top: '+='+distance+'%'},1500);

我測試了這個，它爲我工作。讓我知道如果它不起作用。

來源

2012-06-22 06:16:26

Thx @AaronMiler，這是我長時間編碼和工作，但簡短的形式亞歷克斯的評論上面運作良好。 - Thx爲跟進，藝術 –

jquery .animate通過％of object X或Y

回答

相關問題