Переместите изображение в положение DIV с помощью jQuery 1.3.x

Question

У меня есть несколько маленьких изображений, которые я отображаю размером с иконку (32x32). Я хочу анимировать их от текущей позиции на странице до x, y DIV в любое время, когда кто-нибудь нажимает на любое из изображений. Каков наилучший способ сделать это с помощью jQuery?

Answer 1

Похоже, что уже есть плагинов jquery , которые делают то, что вы ищете.

По ссылке CJ Object Scaler должен быть в состоянии убедиться, что ваши изображения соответствуютв пределах указанного размера.JQUERY IMAGE MAGNIFY обрабатывает анимацию и прозрачность изображений.

Answer 2

Ладно, прямо из головы, вы можете использовать функцию offset (), чтобы получить координаты x и y как изображения, так и делителя, в который вы хотите переместить изображение. смещение (). влево и смещение (). вправо.

Тогда я также думаю, что вам нужно убедиться, что изображение расположено абсолютно для правильной работы. Затем просто используйте функцию animate () в элементе изображения и добавьте новые координаты x и y в функцию animate (), чтобы изображение стало там.

Перейдите на docs.jquery.com и ознакомьтесь с параметрами, необходимыми для функции animate ().

Я попытаюсь найти примеры кода, если вы боретесь.

Answer 3

Если я правильно понял вопрос, то вы можете изменить свойства CSS на свойства изображения. То есть поместите изображения в элемент div и переместите элемент div в положение значка, на который вы нажали.

$("#divname").css({'width' : '32', 'height' : '32' , 'left' : 'IMAGELEFT', 'top' : 'IMAGETOP'});

Если я понимаю вопрос.

EDIT:

Чтобы переместить изображение в div:

$("#image").click(function(){
  $(".block").animate({'left': 'DIVPOSITION', 'top', 'DIVPOSITION'}, 'slow', function() {
 $("#div").html("<img src=\"THEIMAGE\">");
   });
 );
});