2016-10-01 72 views
3

我试图宣传广告客户,当用户点击广告客户链接时,它会在到达广告客户的网站之前通过不同链接重定向5-6次(用于跟踪目的)。完全加载链接

是否可以在用户点击链接的页面上显示某种加载图标,然后在链接完全加载时将用户重定向到广告商的网站?

我搜索,发现这个代码,但我不知道如何在我的情况下实现这一点:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script> 
 
<script src="http://cdnjs.cloudflare.com/ajax/libs/modernizr/2.8.2/modernizr.js"></script> 
 

 
//paste this code under the head tag or in a separate js file. 
 
\t // Wait for window load 
 
\t $(window).load(function() { 
 
\t \t // Animate loader off screen 
 
\t \t $(".se-pre-con").fadeOut("slow");; 
 
\t });
.no-js #loader { display: none; } 
 
.js #loader { display: block; position: absolute; left: 100px; top: 0; } 
 
.se-pre-con { 
 
\t position: fixed; 
 
\t left: 0px; 
 
\t top: 0px; 
 
\t width: 100%; 
 
\t height: 100%; 
 
\t z-index: 9999; 
 
\t background: url(images/loader-64x/Preloader_2.gif) center no-repeat #fff; 
 
}
<div class="se-pre-con"></div>

+0

向我们展示你的代码中迄今所做的什么,究竟要达到 – Zeeshan

+0

一切都是可能的。但问题是你已经做了什么来实现它? –

回答

0

由于其重定向到别人的网站,你不能改变的内容这些网站有一个加载图标。

您可以将它加载到iframe中,并且当iframe在5秒内没有改变其位置时,将iframe显示为整个页面并隐藏加载图标。您还可以将目标设置为'_top',以便每当您单击链接时都会更改浏览器中的网址。

<a href="http://example.com/tracking-link" class="tracking">Click!</a> 
<iframe id="preload-frame" style="position: absolute; z-index: 9999; top: 0; left: 0; bottom: 0; right: 0;" hidden> 
<script type="text/javascript">var iframe=false;</script> 
</iframe> 
<div class="se-pre-con" hidden></div> 
var frame = document.getElementById('preload-frame'); 
onclickConstructor = function (href) { 
    return function() { 
    document.getElementsByClassName('se-pre-con')[0].removeAttribute('hidden'); 
    var timer; 
    var cleanup = function() { 
     frame.removeAttribute('hidden'); 
     frame.setAttribute('target', '_top'); 
     document.getElementsByClassName('se-pre-con')[0].setAttribute('hidden', 'true'); 
    } 
    frame.onload = function() { // Whenever the iframe (re)loads the whole page 
     if (timer) { 
     (clearTimeout || clearInterval)(timer); 
     } 
     timer = setTimeout(cleanup); 
    } 
    frame.src = href; 
    }; 
} 

if (iframe !== false) { 
    var trackingLinks = document.getElementsByClassName('tracking'), function(el); 
    for (var i = 0; i < trackingLinks.length; i++) { 
    el.onclick = onclickConstructor(el.href); 
    el.href = 'javascript:void(0);'; 
    }; 
}