Как создать переход блока в jQuery - PullRequest
Новая
       33

Как создать переход блока в jQuery

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

Каков наилучший способ создать переход блока в jQuery? Есть ли плагины, которые обеспечивают этот переход (только переход, я не хочу галерею изображений, которая имеет такой переход!)?

Я ищу что-то вроде http://mitya.co.uk/scripts/Blockster-transition-effect-122 или переход блока диагонального расширения в http://codecanyon.net/item/jquery-banner-rotator-slideshow/full_screen_preview/109046

Проблема с первой ссылкой в ​​том, что она очень медленная, когда используется немного больше блоков. Я не могу понять, как был создан переход по второй ссылке.

1 Ответ

1 голос
/ 26 января 2012

если вы добавите этот код в blockster.js в строке 144, у вас будет больше блоков одновременно исчезать. 

/* ------------------
| ANIMATION - with all blocks built, set an interval to turn them all on, one by one.
| When all blocks in position, and all have finished anim (if fade rather than simple)
|   - kill int
|   - shuffle slides so the one our blocks contain parts of is genuinely topmost
|   - remove blocks
------------------ */
    var simultaneous = 5;
for(var i = 0; i < simultaneous; ++i)
{
    addTimer(nextSlide, thiss, i, simultaneous);
}
}

function addTimer(nextSlide, thiss, i, simultaneousBlocks)
{
    setTimeout(function()
    {
    var animInt = setInterval(function() 
        {
        if(thiss.params.holder.children('.block:not(:visible)').length > 0)     
            {
            var blocks = thiss.params.holder.children('.block:not(:visible)');
        with($(blocks.get(!thiss.params.random ? 0 : Math.floor(Math.random() * blocks.length)))) thiss.params.animType == 'simple' ? show() : fadeIn(thiss.params.blockAnimSpeed);
    }
    else if ($('.block:animated').length == 0) 
            {
        clearInterval(animInt);
        nextSlide.siblings().hide();
        nextSlide.show();
        $('.block').remove();
        }
    }, thiss.params.blockAnimSpeed);
}, (thiss.params.blockAnimSpeed / simultaneousBlocks) * i);     
}
...