Доброго времени суток)
Прошу помощи, имею сайт на WP.
Cокращаю ссылки через плагин Pretty Links(про версия)
в том плагине есть переход по ссылке при помощи JavaScript(так называемая прокладка)
Я создал контент на этой вкладке, и синхронизировал обычный таймер с временем перехода, который я поставил в самом плагине.( и поставил таймер савтоматическим закрытием по времени, в надежде что человек будет сидеть на вкладке что бы она не закрылась) Было все прекрасно, и меня все устраивало до тех пор пока я не зашел на сайт "хауди хо" на этом сайте реализован таймер; обратный отсчет идет когда пользователь на вкладке, и останавливается когда пользователь уходит с вкладки - по возвращению продолжается отсчет.
Я порылся в коде прокладки и обнаружил такую вещь
Код прокладки(частично)<div><script type='text/javascript'>
/* <![CDATA[ */
var plpJsRedirectL10n = {"url":"Ссылка на скрипт прямого скачивания с яндекс диск","delay":"15000"};
/* ]]> */
</script>
<script type='text/javascript' src='https://otgamera.ru/wp-content/plugins/pretty-link/pro/js/javascript-redirect.js?ver=3.0.9'></script>
</head>
<body>
Перейдя по ссылке скрипта на который ссылается данный код можно понять что там стоит обычный таймер с подстановкой по времени
ТаймерsetTimeout(function () {
window.location = plpJsRedirectL10n.url;
}, plpJsRedirectL10n.delay);
Суть вопроса заключается в том что - можно ли как то модифицировать данный таймер что бы при переходе на другую вкладку таймер останавливался? в тоже время хотелось бы все еще подставлять время в плагине
+ можно ли как то реализовать вывод данного таймера на самой странице, естественно с остановкой времени
P.s. прокладка для дополнительного заработка)))
Весь код прокладки<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="robots" content="noindex" />
<title>#OT gamera</title>
<div class="bg"></div>
<div class="content">
<script type="text/javascript" nonce="f7e8463c322c46628f11797dab2" src="//local.adguard.org?ts=1567327875013&name=AdGuard%20Popup%20Blocker&name=AdGuard%20Assistant&name=AdGuard%20Extra&type=user-script"></script><link href="https://fonts.googleapis.com/css?family=Neucha|Oswald|Play&display=swap" rel="stylesheet">
<meta name="viewport" content="width=device-width, user-scalable=yes">
<meta name="referrer" content="no-referrer" />
<body>
<p style="text-align: center;"><img class="alignnone size-medium wp-image-2382" src="https://otgamera.ru/wp-content/uploads/2019/06/logo-otgamera-350x70-300x60.png" alt="" width="300" height="60" /></p>
<div class="layer2">
<h1 style="text-align: center;color:#008000">Идёт поиск файла на сервере</h1>
<div class = "centerbit">Примерно осталось: <span id="timer_inp">15</span> сек.
<script type="text/javascript">
function timer(){
var obj=document.getElementById('timer_inp');
obj.innerHTML--;
if (obj.innerHTML==0){
setTimeout(function(){},1000);
} else {
setTimeout(timer,1000);
}
}
setTimeout(timer,1000);
</script>
</div>
<p style="text-align: center;">Почему так происходит описано <a href="https://otgamera.ru/chto-za-fignya/" target="_blank" rel="noopener">здесь</a></p>
</biv>
<div class = "centerbit">
<button class="custom-btn btn-4" onclick="window.open('', '_self', ''); window.close();" ><span>Закрыть вкладку скачивания</span></button>
</biv>
<biv class = "naz">
<script type="text/javascript">
window.onload = function () {
var i = 35
var timer = setInterval(function () {
i--;
document.getElementById('timer').innerHTML = 'Страница закроется примерно через: ' + i;
if (i == 0) {
document.getElementById('example').style.display = 'block';
document.getElementById('timer').style.display = 'none';
clearInterval(timer);
setTimeout(function() {
window.close();
},3000 );
}
}, 1000)
}
</script>
<div id="timer"></div>
<div id="example" style=" display: none; ">
Еще больше модов на сайте, создавай контент с нами!
</div>
<div>
<p>
<!-- Yandex.RTB R-A-414468-4 -->
<div id="yandex_rtb_R-A-414468-4"></div>
<script type="text/javascript">
(function(w, d, n, s, t) {
w[n] = w[n] || [];
w[n].push(function() {
Ya.Context.AdvManager.render({
blockId: "R-A-414468-4",
renderTo: "yandex_rtb_R-A-414468-4",
async: true
});
});
t = d.getElementsByTagName("script")[0];
s = d.createElement("script");
s.type = "text/javascript";
s.src = "//an.yandex.ru/system/context.js";
s.async = true;
t.parentNode.insertBefore(s, t);
})(this, this.document, "yandexContextAsyncCallbacks");
</script>
</div>
<style>
.h1 {
font: 16pt Oswald;
}
.layer2 {
font-family: 'Play', sans-serif;
}
.naz{
font-family: 'Neucha', cursive;
color:#FF0000;
}
@media screen and (max-width: 600px) {
body {
font-size:1.5em;
}
…
h2 {
font-size:2.5em;
}
}
.buttons-coll {
width: 90%;
margin: 50px auto;
text-align: center;
}
.custom-btn {
padding: 10px 25px;
font-family: "Roboto", sans-serif;
font-weight: 500;
background: transparent;
outline: none !important;
cursor: pointer;
transition: all 0.3s ease;
position: relative;
display: inline-block;
}
.btn-4 {
width: 330px ;
height: 40px auto;
line-height: 46px;
padding: 0;
border: none;
}
.btn-4 span {
position: relative;
display: block;
width: 100%;
height: 100%;
}
.btn-4:before,
.btn-4:after {
position: absolute;
content: "";
right: 0;
top: 0;
background: #000;
transition: all 0.3s ease;
}
.btn-4:before {
height: 50%;
width: 2px;
}
.btn-4:after {
width: 20%;
height: 2px;
}
.btn-4:hover:before {
height: 100%;
}
.btn-4:hover:after {
width: 100%;
}
.btn-4 span:before,
.btn-4 span:after {
position: absolute;
content: "";
left: 0;
bottom: 0;
background: #000;
transition: all 0.3s ease;
}
.btn-4 span:before {
width: 2px;
height: 50%;
}
.btn-4 span:after {
width: 20%;
height: 2px;
}
.btn-4 span:hover:before {
height: 100%;
}
.btn-4 span:hover:after {
width: 100%;
}
.centerbit {
text-align: center;
}
.content {
position: relative;
z-index: 2;
color: #000;
}
.bg {
position: absolute;
z-index: 1;
left: -10px;
top: -10px;
right: -10px;
bottom: -10px;
filter: blur(5px);
background: url(https://otgamera.ru/wp-content/uploads/pattern_neto-1-min.gif) no-repeat center;
background-size: cover;
}
</style>
</body>
<div><script type='text/javascript'>
/* <![CDATA[ */
var plpJsRedirectL10n = {"url":"ссылка на скрипт прямого скачивания с яндекс диска","delay":"15000"};
/* ]]> */
</script>
<script type='text/javascript' src='https://otgamera.ru/wp-content/plugins/pretty-link/pro/js/javascript-redirect.js?ver=3.0.9'></script>
</head>
<body>
</body>
</html>
Если сказать точнее то я понял что
"delay":"15000"};
вставляется время через плагин
А вот тут
setTimeout(function () {
window.location = plpJsRedirectL10n.url;
}, plpJsRedirectL10n.delay);
происходит отсчет, как реализовать с остановкой времени?
И как к примеру превратить во такой таймер
spoiler<div class = "centerbit">Примерно осталось: <span id="timer_inp">15</span> сек.
<script type="text/javascript">
function timer(){
var obj=document.getElementById('timer_inp');
obj.innerHTML--;
if (obj.innerHTML==0){
setTimeout(function(){},1000);
} else {
setTimeout(timer,1000);
}
}
setTimeout(timer,1000);
</script>
в таймер с остановкой времени при неактивной вкладке)
Готовые куски кода приветствуются - я чайник)