2016-10-01 71 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);'; 
    }; 
}