Непрозрачность JQuery Animate включена, затем выключена при анимации позиции

Question

Непрозрачность JQuery Animate включена, затем выключена при анимации позиции

0

Имея некоторые проблемы, исчезающие, а затем исчезающие во время анимации позиции, все в течение одной и той же продолжительности. Я бы предпочел использовать непрозрачность, но работает fadeIn/fadeOut. Благодарю. Херес JSFiddle

$(document).ready(function () {
    runIt();
});

function runIt() {
    $('#ball').css({
        opacity: '0'
    }).animate({
        opacity: '1',
        left: '355'
    }, 2000).animate({
        opacity: '0'
    }, function () {
        $('#ball').removeAttr('style');
        runIt();
    });
}

JSFiddle

seedy 11 янв. 2014, в 09:46

Источник

0

Вы не указали «проблему», с которой столкнулись
Wes Cossick 11 янв. 2014, в 08:23
0

Ищите это: jsfiddle.net/abhitalks/2vT6M/1 ?
Abhitalks 11 янв. 2014, в 08:28
0

Этот пример со скрипкой был лучшим из того, что я придумал, но пауза ему не понравилась. Я думаю, что это была также проблема, которую я имел.
seedy 11 янв. 2014, в 08:44

Показать ещё 1 комментарий

Теги:

jquery

css

jquery-animate

2 ответа

2

Здесь приведен пример непрерывного интервала с постоянными переменными, которые вы можете настроить.

$(document).ready(function () {
    runIt();
});

function runIt() {
    var WIDTH = 350,
        DURATION = 1000;

    $('#ball')
    .css({ opacity: '0', left: '0' })
    .animate({ opacity: '1', left: WIDTH/2 }, DURATION/2, 'linear')
    .animate({ opacity: '0', left: WIDTH }, DURATION/2, 'linear', runIt);
}

Скрипт: http://jsfiddle.net/2vT6M/6/

EDIT: немного очистил код.

Rayan Bouajram 11 янв. 2014, в 06:41

1

Мне очень нравится эта хорошая работа. Я мог бы поднять это для загрузки страницы где-то хаха
Deryck 11 янв. 2014, в 08:33
0

+1 за редактирование
Abhitalks 11 янв. 2014, в 08:39

Ещё вопросы

Вы не указали «проблему», с которой столкнулись
Этот пример со скрипкой был лучшим из того, что я придумал, но пауза ему не понравилась. Я думаю, что это была также проблема, которую я имел.
Мне очень нравится эта хорошая работа. Я мог бы поднять это для загрузки страницы где-то хаха

adeneo · Accepted Answer · 2014-01-11T07-10-00.000Z

Чтобы выполнить несколько анимаций одновременно, вы должны вызвать dequeue()

function runIt() {
    $('#ball').css({
        opacity : 0,
        left : 0
    }).animate({
        left: '355px'
    }, 2000).animate({
        opacity: 1
    },1000, function() {
        $(this).animate({
            opacity: 0
        },1000, runIt);
    }).dequeue()
}

FIDDLE