У меня есть сетка изображений, загружаемых на страницу. Они, по существу, div
рядом друг с другом и, когда страница заполняется она перемещается к следующей строке.
Когда я нажимаю на изображение, я хочу, чтобы это изображение исчезло, и как только анимация будет завершена, я хочу, чтобы остальные элементы скользнули, чтобы заполнить свое место.
У меня нет проблем с щелчком и затуханием, просто сполнением оставшихся элементов. В настоящее время они просто прыгают, чтобы заполнить свое место, как только анимация будет завершена.
EDIT: Забыл jsfiddle: http://jsfiddle.net/YuFqh/
Попробуй это:
$(".profileImage").click(function() {
$(this).animate({opacity: "0.0"}).animate({width: 0}).hide(0);
})
Анимируйте свою непрозрачность до 0, чтобы убрать ее из вида, а затем оживите свою ширину до 0, чтобы восстановить пространство, затем скройте его, чтобы полностью удалить его из видимости. Обратите внимание: если вы хотите повторно отобразить, вам придется восстановить предыдущие значения.
как насчет использования обратного вызова fadeOut
$(".profileImage").click(function() {
$(this).animate({opacity:0},400, function(){
// sliding code goes here
$(this).animate({width:0},300).hide();
});
});
.animate()
в какой-либо форме? Возможно, вам придется анимировать высоту элемента до 0, прежде чем фактически скрывать изображение.