Question

使用PreLoadMe预加载简单的静态网站。如果加载某种程度需要很长时间，最好添加链接，这可能会中止（而不是停止）加载，这样用户至少可以在看到某些东西时等待。

JS

$(window).load(function() {
        $('#status').fadeOut();
        $('#preloader').delay(350).fadeOut('slow');
    })

HTML

<div id="preloader">
    <div id="status">&nbsp;</div>
    <a href="#">Leave the loading, I want to see the site!</a>
</div>

CSS

#preloader {
    position: fixed;
    top:0;left:0;
    right:0;bottom:0;
    background-color:#fff;
    z-index:9999; /* makes sure it stays on top */
}

我确实渴望得到帮助。提前谢谢！

Answer 1

只需将点击事件绑定到您要关闭的链接，然后点击隐藏它：

$('#preloader').on('click', '.btn-close', function() {
    $('#preloader').hide();
});

改进后的HTML（最好用某些类来表示密切联系，例如.btn-close）：

<div id="preloader">
    <div id="status">&nbsp;</div>
    <a href="#" class="btn-close">Leave the loading, I want to see the site!</a>
</div>

演示：http://jsfiddle.net/uj6m1eh6/

Answer 2

Example

$('#preloaderHider').click(function() {
    $('#preloader').fadeOut({
        queue: false,
        duration: 'slow'
    });
});

不要忘记设置queue: false选项。如果没有它，当加载窗口时，点击#preloaderHider将无效。

（窗口）.load preloads site with option to abort

2 个答案:

演示：http://jsfiddle.net/uj6m1eh6/