Создание div shake при загрузке страницы?

есть ли в любом случае, чтобы сделать div Box shake при загрузке страницы? Может, раз или два?

обновление: на этом URL у меня все еще не работает при загрузке страницы, что я делаю неправильно? http://tinyurl.com/79azbav

Я думаю, что застрял в загрузке onpage; этот сбой можно увидеть здесь: Get onpage для правильной работы

Я также попытался инициировать анимацию с моим уже реализованным body onLoad:

<body onLoad="document.emvForm.EMAIL_FIELD.focus(); document.ready.entertext.shake();" >

но все равно не как чемпион.

2 ответов


попробуйте что-то вроде этого:

редактировать:
Изменено Shake() to shake() для согласованности с соглашениями jQuery.

jQuery.fn.shake = function() {
    this.each(function(i) {
        $(this).css({ "position": "relative" });
        for (var x = 1; x <= 3; x++) {
            $(this).animate({ left: -25 }, 10).animate({ left: 0 }, 50).animate({ left: 25 }, 10).animate({ left: 0 }, 50);
        }
    });
    return this;
} 

редактировать:
В моем примере left установлен в положение 25, но вы можете уменьшить это для более тонкого эффекта или увеличить его для более выраженного эффекта.

С помощью shake функция:

$("#div").shake();

вот jsFiddle, который демонстрирует это: http://jsfiddle.net/JppPG/3/


небольшое изменение в отличном ответе @James-Johnson для ~ встряхивания~ элементов, которые absolute положении. Эта функция захватывает текущий left положение элемента и встряхивает его относительно этой точки. Я менее сильная встряска, газ-10.

jQuery.fn.shake = function () {
    this.each(function (i) {
        var currentLeft = parseInt($(this).css("left"));
        for (var x = 1; x <= 8; x++) {            
            $(this).animate({ left: (currentLeft - 10) }, 10).animate({ left: currentLeft }, 50).animate({ left: (currentLeft + 10) }, 10).animate({ left: currentLeft }, 50);
        }
    });
    return this;
}