анимация, расширяющаяся покачивание - PullRequest
Новая
       29

анимация, расширяющаяся покачивание

0 голосов
/ 30 декабря 2011

в этом меню, de hovered div расширяется, а все остальные элементы уменьшаются

при изменении размера в правой части меню есть небольшая покачивание, что очень раздражает

Я видел это: Расширяйте div из середины вместо просто сверху и слева, используя CSS расширяется от центра, и они также упоминают покачивание

есть ли способ исправить покачивание?

это мой код

как видите, скорость всегда одинакова, поэтому в теории не должно быть колебаний 

function add() {
    var speed = 50;
    $('.space').hover(
        function() {
            var n = this.id.replace(/[^\d]/g, '');
            $('#space_' + n).removeClass('contract');
            $('#space_' + n).stop().animate({
                height: "107px",
                width: "107px",
            }, speed, 'linear');
            $('.contract').stop().animate({
                height: "73px",
                width: "70px",
            }, speed, 'linear');
        },
        function() {
            var n = this.id.replace(/[^\d]/g, '');
            $('#space_' + n).addClass('contract');
            if($('#space_' + n).hasClass('selected') != true) {
                $('#space_' + n).stop().animate({
                    height: "73px",
                    width: "73px",
                }, speed, 'linear');
            }
            $('.contract').stop().animate({
                height: "73px",
                width: "73px",
            }, speed, 'linear');
        }
    );
}

add();

здесь вы можете увидеть пример меню: http://mellroy.com/dean/

заранее спасибо

1 Ответ

0 голосов
/ 30 декабря 2011

Избавьтесь от границ - лучше используйте фоновое изображение. Если вы поместите все меню на белый и черный фон (соответствующий меню), вы не увидите событие колебания, хотя колебание все еще там. Я сомневаюсь, что вы сможете избежать этого.

...