Question

我正在尝试宣传广告客户，当用户点击广告客户链接时，它会在到达广告客户的网站之前通过不同的链接重定向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.
	// Wait for window load
	$(window).load(function() {
		// Animate loader off screen
		$(".se-pre-con").fadeOut("slow");;
	});

.no-js #loader { display: none;  }
.js #loader { display: block; position: absolute; left: 100px; top: 0; }
.se-pre-con {
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 9999;
	background: url(images/loader-64x/Preloader_2.gif) center no-repeat #fff;
}

<div class="se-pre-con"></div>

Answer 1

由于它重定向到某个elses网站，因此您无法更改这些网站的内容以获得加载图标。

您可以将其加载到iframe中，当iframe未更改其位置（例如5秒）时，将iframe显示为整个页面并隐藏加载图标。您还可以将目标设置为＆＃39; _top＆＃39;因此，只要您点击链接，它就会更改浏览器中的网址。

<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);';
  };
}

完全加载链接

1 个答案: