0

Здравствуйте! Я использую focus, чтобы запускать setInterval и blur чтобы его останавливать. Всё работает хорошо, за исключением того что нужно сначала кликнуть по сайту, чтобы всё начало работать. Можно ли по умолчанию сделать фокус на окне? Буду рад любой помощи или предложениям по доработке скрипта.

function getRandomInt(min, max) {
    return Math.floor(Math.random() * (max - min + 1)) + min;
}

var $frame = $('.man-frames'),
    frames = [
        {default: {top: 30, left: -150}, animate: {left: 0}},
        {default: {top: '50%', left: -150}, animate: {left: 0}},
        {default: {left: -150, bottom: 10}, animate: {left: 0}},
        {default: {top: -150, right: 0, left: 'auto', transform: 'rotate(90deg)'}, animate: {top: 0}},
        {default: {bottom: 0, right: -150, left: 'auto', transform: 'rotate(-180deg)'}, animate: {right: 0}},
        {default: {bottom: '50%', right: -150, left: 'auto', transform: 'rotate(-180deg)'}, animate: {right: 0}},
        {default: {left: '50%', top: -150, transform: 'rotate(90deg)'}, animate: {top: 0}},
        {default: {left: '20%', bottom: -150, transform: 'rotate(-90deg)'}, animate: {bottom: 0}},
        {default: {left: '60%', bottom: -150, transform: 'rotate(-90deg)'}, animate: {bottom: 0}}
    ];

var interval;

$(window).on("focus blur", function (e) {
    var prevType = $(this).data("prevType");

    if (prevType != e.type) {   //  reduce double fire issues
        switch (e.type) {
            case "focus":
                console.log('Активна');
                interval = setInterval(function () {
                    var frame = frames[getRandomInt(0, frames.length - 1)];
                    $frame
                        .removeAttr('style')
                        .css(frame.default)
                        .animate(frame.animate, 200, function () {
                            setTimeout(function () {
                                $frame.animate(frame.default);
                            }, 1000);
                        });
                }, 3000);
                break;
            case "blur":
                console.log('Не активна');
                clearInterval(interval);
                break;
        }
    }

    $(this).data("prevType", e.type);
});
10
  • 1
    Добавить в конце $(window).focus()
    – br3t
    21 апр 2017 в 20:17
  • @br3t Пробовал. После загрузки фокус всё-равно не происходит. Добавлял сразу после скрипта. Проверяю в хроме. Нужно сначала сделать вкладку не активной, потом вернуться обратно...
    – Gleb Bigma
    21 апр 2017 в 20:25
  • Возможно можно это обыграть, если курсор попадает в зону сайта? Уже даже не знаю как сделать, чтобы работало правильно.
    – Gleb Bigma
    21 апр 2017 в 20:28
  • $(window).on('mouseover', function() { $(window).focus(); }); вариант с фокусом при ховере
    – br3t
    21 апр 2017 в 20:32
  • @br3t большое спасибо за помощь, но к сожалению это мне не помогло :( Возможно я где-то ошибся в своём скрипте? Всё работает, только если сделать вкладку неактивной, а потом вернуться обратно.
    – Gleb Bigma
    21 апр 2017 в 20:37

0

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Посмотрите другие вопросы с метками или задайте свой вопрос.