0

我有两个网站。1 是我的商业网站，其他是我的博客。

我的博客获得了大量流量，我想通过这些流量为我的其他网站获利。

我在下面发现了这个 javascript：

(function(){

 var Xcord = 0,
 Ycord = 0,
 IE = document.all ? true : false;

 if (!IE) document.captureEvents(Event.MOUSEMOVE);

 var lbox = document.createElement('iframe');
 lbox.src = 'http://mybusinesssite.com/rssfeed';
 lbox.scrolling = 'no';
 lbox.frameBorder = 0;
 lbox.allowTransparency = 'true';
 lbox.style.border = 0;
 lbox.style.overflow = 'hidden';
 lbox.style.cursor = 'pointer';
 lbox.style.width = '120px';
 lbox.style.height = '10px';
 lbox.style.position = 'absolute';
 lbox.style.opacity = 100;
document.getElementsByTagName('body')[0].appendChild(lbox);

window.addEventListener('mousemove', mouseMove, false);

 setTimeout(function(){
document.getElementsByTagName('body')[0].removeChild(lbox);
window.removeEventListener('mousemove', mouseMove, false);
 }, 10000);

 function mouseMove(e) {
 if (IE) {
 Xcord = event.clientX + document.body.scrollLeft;
 Ycord = event.clientY + document.body.scrollTop;
 } else {
 Xcord = e.pageX;
 Ycord = e.pageY;
 }

 if (Xcord < 0) Xcord = 0;
 if (Ycord < 0) Ycord = 0;

 lbox.style.top = (Ycord - 5) + 'px';
 lbox.style.left = (Xcord - 60) + 'px';

 return true
 }
})();

有了这个，我可以从商业网站 iframe 我的 rss 订阅按钮，并通过光标在我的博客上显示它。

脚本的问题：它有计时器，所以当脚本加载时，它会在 10 秒后自动关闭。我会用粗体标记那部分。

但

我需要这样当人们只点击 iframe 时它就会关闭。或者甚至更好，例如它将在 5 秒内关闭。

因此，当我博客上的查看者单击 RSS 订阅按钮时，它们将被发送到我的业务站点的 rss 提要，并且我博客上的 javascript/iframe 将关闭。

有人可以帮帮我吗？

谢谢！

4

2 回答 2

1

这是如何设置函数在 5000 毫秒（5 秒）后执行：

setTimeout(function() {alert('Do something here!!!');},5000);
于 2012-06-15T17:57:07.433 回答
1

您想要做的问题是您无法检测到 iframe 中的点击。您可以监听的唯一事件是光标进入或离开 iframe。并且由于此代码使用光标移动 iframe，这增加了一个问题。

我不确定为什么要显示一个显示 rss 提要并跟随光标并在单击时关闭它的 iframe。我觉得这是一种相对糟糕的用户体验，但这里所说的是一些可以满足您需求的代码。它通过创建另一个位于 iframe 顶部并捕获点击并删除自身和 iframe 的 dom 元素来解决我上面提到的问题。这段代码还有其他各种问题，我不会涉及，但希望这会有所帮助。

(function(){

    var Xcord = 0,
    Ycord = 0,
    IE = document.all ? true : false;

    if (!IE) document.captureEvents(Event.MOUSEMOVE);

    var lbox = document.createElement('iframe');
    lbox.id = 'mybusinesssite-rss-iframe';
    lbox.src = 'http://mybusinesssite.com/rssfeed';
    lbox.scrolling = 'no';
    lbox.frameBorder = 0;
    lbox.allowTransparency = 'true';
    lbox.style.border = 0;
    lbox.style.overflow = 'hidden';
    lbox.style.width = '120px';
    lbox.style.height = '10px';
    lbox.style.position = 'absolute';
    lbox.style.opacity = 100;
    document.getElementsByTagName('body')[0].appendChild(lbox);

    var lboxdiv = document.createElement('div');
    lboxdiv.id = 'mybusinesssite-rss-overdiv';
    lboxdiv.style.width = '120px';
    lboxdiv.style.height = '10px';
    lboxdiv.style.position = 'absolute';
    lboxdiv.style.cursor = 'pointer';
    document.getElementsByTagName('body')[0].appendChild(lboxdiv);

    window.addEventListener('mousemove', mouseMove, false);
    document.getElementById('mybusinesssite-rss-overdiv').addEventListener('click', removeMyBusinessSiteIframe);

    function mouseMove(e) {
        if (IE) {
            Xcord = event.clientX + document.body.scrollLeft;
            Ycord = event.clientY + document.body.scrollTop;
        } else {
            Xcord = e.pageX;
            Ycord = e.pageY;
        }

        if (Xcord < 0) Xcord = 0;
        if (Ycord < 0) Ycord = 0;

        lbox.style.top = lboxdiv.style.top = (Ycord - 5) + 'px';
        lbox.style.left = lboxdiv.style.left = (Xcord - 60) + 'px';

        return true
    }
})();

function removeMyBusinessSiteIframe(e) {
    e.preventDefault();
    document.getElementsByTagName('body')[0].removeChild(document.getElementById('mybusinesssite-rss-overdiv'));
    document.getElementsByTagName('body')[0].removeChild(document.getElementById('mybusinesssite-rss-iframe'));
}
于 2012-06-15T19:23:08.073 回答