1
<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        body {
            background-color: lightgray;
        }

        body, html {
            width: 100%;
            height: 100%;
            overflow: hidden;
        }

        .container {
            width: 600px;
            height: 600px;
            margin: 50px auto;
            background-color: gray;
            z-index: 1;
        }

        .demo {
            position: fixed;
            width: 100%;
            height: 100%;
            display: none;
            z-index: 22;
        }
    </style>

</head>
<body>
    <div class="container">
            Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cum iste fugit saepe incidunt voluptatum quisquam nulla asperiores dolores aspernatur at assumenda veniam porro ad delectus dicta magni facere perferendis officia commodi laboriosam laborum possimus similique pariatur reiciendis repudiandae suscipit quibusdam ipsa tempore dolore sunt nemo et expedita quis quod mollitia maiores nihil dolorum non accusamus omnis esse minus quas libero qui consequatur recusandae. Doloremque possimus voluptatum iure autem excepturi laborum mollitia dolorem eum fugit numquam architecto facere incidunt non laboriosam hic assumenda ipsam! Delectus sapiente dolorem aliquid voluptate magni voluptas ratione nulla ducimus suscipit quo est maiores atque molestias laboriosam perspiciatis neque inventore sed rem impedit odio autem nisi earum illum animi accusantium consequatur officiis tempore nemo modi! Laboriosam qui doloremque tempore quas corporis iste fugiat ratione libero vero aperiam quam minus itaque impedit at repellat illum animi nemo vitae officiis sed perferendis maiores quos cupiditate magnam dignissimos nesciunt excepturi voluptatibus suscipit amet reiciendis architecto quasi nihil accusantium voluptas laudantium atque odit praesentium! Ad harum delectus necessitatibus praesentium velit nobis officiis illum odio quibusdam inventore eum eveniet sapiente soluta aperiam expedita voluptatem ab fuga tempore dolor aut laborum atque ut labore reprehenderit rerum veritatis dignissimos ipsam quos porro minima. Autem quisquam excepturi assumenda deserunt nulla odio ea eveniet atque eum vitae dicta quaerat corrupti voluptas sapiente sint! Veritatis et aspernatur quaerat nulla necessitatibus tempora impedit provident mollitia beatae! Excepturi omnis architecto adipisci impedit sequi repellat dolorum laboriosam et totam consectetur doloribus quis ipsum aliquam alias repudiandae ex reprehenderit eaque error deleniti a ipsa? Beatae at culpa distinctio debitis vel tempore deleniti consequuntur est cupiditate laborum iste quo cum quis ex vero voluptate fugiat maxime facilis totam quia dolorum sunt veniam. Labore optio voluptatem at voluptas libero natus veritatis quidem nulla ipsa temporibus nihil aperiam placeat aliquam saepe obcaecati omnis asperiores.
            <button>GOGOGO</button>
    </div>

    <div class="demo"></div>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

    <script>
        (function(){
            $('button').on('click', function(){
                $('.demo').load('demo.html');
            })
        })();
    </script>
</body>
</html>

这是我的 html,我想加载这个: http ://buildinternet.com/project/supersized/slideshow/3.2/demo.html 通过单击 DOM 窗口全长中的按钮并在某处放置一个关闭按钮关闭它并再次查看索引页面。不透明度是要走的路,是的,但 demo.html 甚至无法正确加载,我没有 jQuery 功能或任何东西,我得到的只是背景图像,我不知道为什么。

4

0 回答 0