问完全加载链接
EN

Stack Overflow用户

提问于 2016-10-01 20:59:51

回答 1查看 55关注 0票数 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.
	// 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>

javascript

html

回答 1

Stack Overflow用户

发布于 2016-10-01 21:23:34

由于它重定向到别人的网站，您不能更改这些网站的内容，使其具有加载图标。

您可以将其加载到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);';
  };
}

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/39806900

复制

相似问题

问完全加载链接
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问完全加载链接EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问完全加载链接
EN