Как я могу щелкнуть изображение с тем же эффектом, что и firefox, загрузить полную зеленую стрелку. т.е. эффект масштабирования и замирания при одном и том же уровне
Любые предложения Спасибо
Вы можете clone
элемент, а затем использовать .animate()
как
$("img").on("click",function(){
var new_img = $(this).clone();
new_img.css({
"width" : "120px",
"height" : "120px",
"top" : $(this).offset().top,
"left" : $(this).offset().left,
"position" : "absolute"
});
$("body").append(new_img);
new_img.animate({
"width" : "40px",
"height" : "40px",
"opacity" : "0"
},1000,function(){new_img.remove();});
});
РЕДАКТИРОВАТЬ
Чтобы изменить изображение при завершении анимации, вам нужно добавить 2 строки. От первого до начала функции щелчка
var that = $(this);
От второго до конца анимационной функции обратного вызова
that.attr("src" , "IMG_URL");
В jQuery UI-эффектах есть отдельный эффект, называемый scale()
.
Просто зайдите на их сайт и получите его!
Простым способом сделать как масштаб, так и выцветание будет использование.hide("slow") или.show("slow"). Кроме того, для большего контроля вы можете использовать очередь: false в двух отдельных анимациях.
например
$("#someid").toggle("scale", queue:false);
$("#someid").fadeIn(queue:false);