2015-04-18 5 views
0

Я запускаю таймер на основе фокуса окна. Если окно находится в фокусе, тогда таймер будет двигаться вперед, если не появится сообщение. Я показываю фокусное сообщение в focusmsg div и скрываю это div, когда окно находится в фокусе. В результате фокусное сообщение не видно.Возобновить параметр, когда окно не в фокусе

Теперь вместо того, чтобы показывать простое фокусное сообщение, я хочу показать кнопку возобновления, чтобы пользователь мог нажать кнопку возобновления, чтобы убедиться, что окно находится в фокусе, вернувшись в окно, которое было не в фокусе.

Помните, что кнопка возобновления не должна исчезать, пока пользователь не закроет окно, нажав кнопку возобновления.

Было бы здорово, если бы вы могли предоставить jsfiddle своим ответом!

if(w_focus) { 
     $("#focusmsg").hide(); 

     var timer = 0; 
     var full = 10; 
     timer++; 

     if(timer == full) { 
      var show = "Full"; 
      $("#timmsg").html(show); 
     } 


     else { 
      setTimeout(adTimer, 1000); 
      $("#between").hide(); 
     } 
    } else { 
     setTimeout(adTimer, 2000); 

     var msg = "Focus lost! Resume now"; 
     $("#focusmsg").html(msg); 
    } 


$(document).ready(function() { 

     var hidden, change, vis = { 
      hidden: "visibilitychange", 
      mozHidden: "mozvisibilitychange", 
      webkitHidden: "webkitvisibilitychange", 
      msHidden: "msvisibilitychange", 
      oHidden: "ovisibilitychange" /* not currently supported */ 
     };    
    for (hidden in vis) { 
     if (vis.hasOwnProperty(hidden) && hidden in document) { 
      change = vis[hidden]; 
      break; 
     } 
    } 
    if (change) 
     document.addEventListener(change, onchange); 
    else if (/*@[email protected]*/false) // IE 9 and lower 
     document.onfocusin = document.onfocusout = onchange 
    else 
     window.onfocus = window.onblur = onchange; 

    function onchange (evt) { 
     evt = evt || window.event; 
     if (evt.type == "focus" || evt.type == "focusin") 
      window_focus = true; 
     else if (evt.type == "blur" || evt.type == "focusout") 
      window_focus = false; 
     else   
      window_focus = this[hidden] ? false : true; 
    } 

}); 

ответ

1

Вы можете использовать следующие параметры для переменной w_focus истины, когда кнопка нажата резюме. Обратите внимание, что вам нужно будет удалить функцию window.onfocus и использовать ее вместо этого, поэтому она будет устанавливать только переменную w_focus в true, когда пользователь на самом деле нажимает кнопку возобновления.

Живой пример:

var w_focus = true; 
 

 
window.onblur = function() { 
 
    w_focus = false; 
 
    $('#resume-button').show(); 
 
} 
 

 
$('#resume-button').on('click', function() { 
 
    w_focus = true; 
 
    $('#resume-button').hide(); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<button id="resume-button" style="display:none">Resume</button>

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

Ссылка на рабочий пример JSFiddle:http://jsfiddle.net/3tzmeta4/

+0

@query это работало для вас? –

+0

Не знаю, почему, но кнопка возобновления (функция onclick) не работает с моим кодом. Я обновил свой пост, предоставив больше информации для вашего удобства. Было бы лучше, если бы вы предоставили пример JSFiddle на основе моего кода! – query

+0

В нижней части моего ответа есть пример JSFiddle: http://jsfiddle.net/3tzmeta4/ –

Смежные вопросы