-4

だから私は家族のために結婚式のウェブサイトを作成していて、サイトが表示される前にパスワードを入力するための非常に簡単な方法が欲しい. 安全である必要はありません。

ウェブサイトの上に白い「レイヤー」を配置して、その上に単純なパスワードフォームを表示できると考えていました（ウェブサイトはその下に読み込まれます）。そして、パスワードを入力すると白いレイヤーが消えてウェブサイトが現れます。

誰かが私を助けることができますか？

4

3 に答える 3

0

ええと..安全である必要はないと言ったので（身震い）、あなたは逃げることができます......

Web サイトに関連するすべてのものを何らかのコンテナーにラップしdivます'main-content'。非表示にする方法については、いくつかのオプションがあります。

  1. CSS 表示:なし;
  2. インライン スタイル: 表示: なし;
  3. 高さ:0px;

に加えて'main-content'、同様のレベルで div を作成し、識別子、つまり class of を付け'login-content'ます。これはそのままにしておきます (つまり、表示されます)。

DOM が読み込まlogin-contentれると、メイン コンテンツは表示されませんが、表示されるはずです。

ユーザーが「正常にログイン」したら、スタイルを元に戻します。つまりmain-content-> display:block;、height:100%、何でも..

于 2013-01-23T22:53:13.660 に答える
0

js の助けを借りて、これを行うことができます。 

var password;

var pass1="1234567";

password=prompt('Enter your password',' ');

if (password==pass1) {
  $('body').show();
} else  {
  $('body').hide();
}

詳細情報が必要な場合は、これがソースです:
http://www.pageresource.com/jscript/jpass.htm

于 2013-01-23T23:05:51.477 に答える
0

これが実際の例です。

HTML

<div class="page">
    HERE IS MY PAGE
</div>
<div class="cover">
    HERE IS THE COVER
</div>

JavaScript (jQuery)

$('.cover').click(function(){
    $(this).fadeOut(1000, function(){
        $(this).remove();    
    });   
});

CSS

.page{
    background-color:green;
    height:200px;
}
.cover{
    background-color:yellow;
    height:200px;
    z-index:200;
    position:fixed;
    top:0;
    left:0;
    float:left;
    width:100%;

}

JSFiddle で参照してください。

于 2013-01-23T22:58:32.573 に答える