2015-10-29 53 views
0

我已經搜索周圍,但我很難找到答案。我對這一切還很陌生,並且自我教導。我有一些JavaScript加載點擊疊加,這會帶來一種形式。我也有一些JavaScript在10秒後加載頁面加載時的覆蓋。如果觸發器未點擊,在'x'秒後加載重疊

我想要實現的是將它們鏈接在一起,所以如果沒有點擊觸發器,疊加加載10秒後。這是我點擊的代碼。

$(function() { 
    $('.cta').click(function(){ 
     $('.overlay').css('display','flex'); 
     return false; 
    }); 

    $('.close-btn').click(function(){ 
     $('.overlay').hide(); 
    });  
}); 

這是我的頁面加載代碼。

$(document).ready(function() { 
    // check cookie 
    var visited = $.cookie("visited") 

    // load overlay if they haven't visited 
    if (visited == null) { 
     setTimeout(function(){ 
      $('.overlay').css('display','flex');}, 10000); 
     }); 
     $.cookie('visited', 'yes'); 
    } 

    // set cookie 
    $.cookie('visited', 'yes', { expires: 1, path: '/' }); 
}); 

$('close-btn').click(function() { 
    $('.overlay').fadeOut(200, "linear"); 
}); 

我一直在單獨測試它們,沒有同時運行它們。

+0

您可以將setTimeout保存到變量中,並在點擊觸發器時將其取消。 http://www.w3schools.com/jsref/met_win_cleartimeout.asp – Danmoreng

+0

@JayMee可能再次閱讀,並感謝downvote爲我的工作答案btw。 – Danmoreng

+0

@ user2415266 - 他在哪裏指定他有什麼問題? –

回答

0

這就是你的代碼在我的評論中寫的clearTimeout()方法的樣子。

var myTimeout; 

$(document).ready(function() { 
    // set onClick handlers after the page is loaded. 
    $('.cta').click(function(){ 
     clearTimeout(myTimeout); 
     $('.overlay').css('display','flex'); 
     return false; 
    }); 

    // Probably choose one of those, you are currently using two 
    // onClick handlers for the close-btn apparently: 
    $('.close-btn').click(function(){ 
     $('.overlay').hide(); 
    }); 
    $('.close-btn').click(function() { 
     $('.overlay').fadeOut(200, "linear"); 
    }); 

    // check cookie 
    var visited = $.cookie("visited") 

    // load overlay if they haven't visited 
    if (visited == null) { 
     myTimeout = setTimeout(function(){ 
     $('.overlay').css('display','flex');}, 10000); 
     // }); <= Those were wrong here. 
     $.cookie('visited', 'yes'); 
    } 

    // set cookie 
    $.cookie('visited', 'yes', { expires: 1, path: '/' }); 
}); 
+0

對不起,這聽起來像一個愚蠢的問題。我將點擊保存爲click.js並彈出保存爲popup.js,如果我將變量保存在click.js中,popup.js文件能夠讀取它嗎?因爲我試圖將它全部放在一個文件中,我無法使其正常工作,但是單獨使用它可以正常工作。 –

+0

並感謝您的信息btw! –

+0

那麼,你應該在加載文檔時設置onClick處理程序。我相應地編輯了我的代碼,這應該在單個腳本文件中工作。 – Danmoreng