Question

我正在尝试执行与https://mylapka.com/pem类似的操作，以便文本消失，所有元素都会返回到www.website.com编辑器。我正在尝试使用覆盖所有元素的背景图像创建一个div，并在单击时消失。无论我尝试什么，它都不会覆盖菜单。有没有办法做到这一点。我对编码非常陌生并且不太擅长，所以任何帮助都非常感激，试着学习！

我将以下所有代码放在自定义的html框中。

<html>
<head>
<script type="text/javascript">
$('#btn').click(function(e){    
$('#fancy, #btn').fadeOut('slow', function(){
    $('#bank, #btn-bk').fadeIn('slow');
});
});

$('#btn-bk').click(function(e){    
    $('#bank, #btn-bk').fadeOut('slow', function(){
        $('#fancy, #btn').fadeIn('slow');
    });
});
</script>
</head>
<body>
<div>
<a id="btn">

<p style="background-image:url(http://i1158.photobucket.com/albums/p616/amattson21/
Untitled-1.png);width:1200px;height:800px;position:relative;z-index-1000;" 
align="center">
</p>

<p style="color:white;font-size:200px;margin-top:-250px;text-shadow: 2px 2px 0px #000000;"
align="center">
TEXT
</p>

</a>
</div>
</body>
</html>

Answer 1

请查看我制作的代码。我创建了另一个HTML，因为我相信这是实现所需输出的正确方法。

Fiddle

<强> HTML

<div id="main">
    <p>Your main website here.</p>
    <p>Your main website here.</p>
    <p>Your main website here.</p>
    <p>Your main website here.</p>
    <p>Your main website here.</p>
    <p>Your main website here.</p>
    <p>Your main website here.</p>
    <p>Your main website here.</p>
    <p>Your main website here.</p>
    <p>Your main website here.</p>
    <p>Your main website here.</p>
    <p>Your main website here.</p>
</div>
<div id="overlay">
    <p class="text">TEXT</p>
</div>

<强> CSS

html, body, #main, #overlay {
    width:100%;
    height:100%;
}
p, body {
    margin:0;
    padding:0;
}
#main {
    background:url('http://subtlepatterns.com/patterns/old_map.png');
}
.text {
    color:white;
    font-size:200px;
    text-shadow: 2px 2px 0px #000000;
    text-align:center;
    z-index:10;
    position:absolute;
    top:50%;
    left:50%;
    margin:-150px -230px ;
}
#overlay {
    left:0;
    top:0;
    position:absolute;
    background:url('http://subtlepatterns.com/patterns/old_map.png');
}

<强>的jQuery

$('#overlay').click(function (e) {
    $(this).fadeOut();
});

如何在他们的编辑器中隐藏您的自定义website.com网站菜单

1 个答案:

Fiddle