¿Qué hay de malo en este código

Question

function moveit() { 

    var newTop = Math.floor(Math.random()*350); 
    var newLeft = Math.floor(Math.random()*1024); 
    var newDuration = 9000 

    $('#friends').animate({ 
     top: newTop, 
     left: newLeft, 
!!! -->  width: "+="+((newTop-$('friends').css('top'))*3), 
     }, newDuration, function() { 
     moveit(); 
     }); 

} 

$(document).ready(function() { 
    moveit(); 
}); 

Se supone que hace que una imagen vuele (funciona). Agregué la línea marcada con "!!! ->" que debería hacer que la imagen se agranda cuanto más cerca esté de la parte inferior de la página.

¿Qué hice mal? El código no arroja ningún error.

Answer 1

$('friends').css('top') devuelve una cadena, se tendrá que convertir esto en un int antes de poder utilizarlo para restar de newTop

parseInt($('friends').css('top'), 10) 

que hacer el truco

También es necesario utilizar un ID o identificador de clase en su selector de jQuery, ya sea '#friends' o '.friends' pero me imagino que usted está buscando algo con el ID de amigos

Prueba este

width: "+="+((newTop - parseInt($('#friends').css('top'), 10))*3), 

Answer 2

Bastante seguro de que su problema es .css("top") devolverá un valor de cadena como 100px. Desea utilizar .position().top en su lugar para obtener el valor entero en su lugar.

Answer 3

¿No se refiere a $('#friends') en lugar de simplemente $('friends')? Su declaración está buscando una etiqueta de elemento "amigos" y tratando de obtener su valor de propiedad CSS top.

Sugiero que también almacene en caché el selector $('friends') para que no tenga que seleccionarlo dos veces para la llamada .animate().

Answer 4

Creo que su problema está en cómo se obtiene la primera posición. Puede que no sea exactamente lo que quiere, pero yo tengo trabajo aquí ...

http://jsfiddle.net/shaneblake/YXMbh/