こんにちは、私はこのコードで約 24 時間髪を伸ばしています。
私が達成したいのは、ページを上下にスライドさせる単純なサインイン/サインアップオプションであり、サインインをクリックするたびにサインアップフォームが表示されると、他のフォームが非表示になり、その逆も同様です。
私のコードで何が起こるかというと、サインアップまたはサインインのアンカーをクリックすると、そのアンカーが消え、フォームが単に .()show コマンドのスライドアップまたはダウンに追従しませんが、作成したキャンセルボタンを押すとフォームを非表示にするイベント .slideUp() のアニメーションが押し出され、フォームが非表示になります。フォームが表示されている場合はいつでも、サインアップと言ってみましょう.2つのフォームのサインをクリックすると、同時に表示されます.
この人たちと一緒に私を助けてくれませんか?どうもありがとうございました!
HTML
<div id="divLinks">
<div id="divNav">
<ul>
<li><a href="index.html">Home</a>
</li>
<li><a href="shop.html"> Shop</a>
</li>
<li><a href="sell.html">Sell</a>
</li>
</ul>
</div>
<div id="divNavAccount">
<ul>
<li><a href="#" class="show_hide_sign_up">Not a user yet?</a>
</li>
<li><a href="#" class="show_hide_sign_in">Sign In</a>
</li>
</ul>
</div>
</div>
<div id="divSignIn" class="show_hide_sign_in">
<div id="divSignInFields">
<form>
<input type="text" name="username" value="username">
<br />
<input type="password" name="password" value="password">
<br />
<input type="submit" value="Submit">
<input type="button" value="Cancel" class="hideCancel">
</form>
</div>
<div id="divSignInDescription">
<ul>
<li>Username:</li>
<li>Password:</li>
</ul>
</div>
</div>
<div id="divSignUp" class="show_hide_sign_up">
<div id="divSignUpFields">
<form>
<input type="text" name="username" value="username">
<br />
<input type="password" name="password" value="password">
<br />
<input type="text" name="first name" value="first name">
<br/>
<input type="text" name="last name" value="last name">
<br/>
<input type="email" name="email" value="user@email.com">
<br/>
<input type="submit" value="Submit">
<input type="button" value="Cancel" class="hideCancel2">
<br/>
<input type="reset" value="Reset">
</form>
</div>
<div id="divSignUpDescription">
<ul>
<li>Username:</li>
<li>Password:</li>
<li>First Name:</li>
<li>Last Name:</li>
<li>Email:</li>
</ul>
</div>
</div>
CSS
.show_hide_sign_in {
}
.show_hide_sign_up {
}
.div_show_hide_sign_in {
}
.div_show_hide_sign_up {
}
.hideCancel {
}
.hideCancel2 {
}
血まみれの Jquery
$(document).ready(function(e) {
$("#divSignIn").hide();
$('.show_hide_sign_in').click(function(){
$(".show_hide_sign_in").slideUp().show();
$("#divSignIn").slideUp.show();
/*---hides the sign in form--*/
$("#divSignUp").hide();
/*---hides the sign in form--*/
});
/*--cancel button--*/
$('.hideCancel').click(function(){
$("#divSignIn").hide().slideDown();
});
/*--cancel button--*/
});;
/*sign up href sliding down*/
$(document).ready(function(e) {
$("#divSignIn").hide();
$('.show_hide_sign_in').click(function(){
$(".show_hide_sign_in").slideUp().show();
$("#divSignIn").slideUp.show();
/*---hides the sign in form--*/
$("#divSignUp").hide();
/*---hides the sign in form--*/
});
/*--cancel button--*/
$('.hideCancel').click(function(){
$("#divSignIn").hide().slideDown();
});
/*--cancel button--*/
});;
/*sign up href sliding down*/
$(document).ready(function(e) {
$("#divSignUp").hide();
$('.show_hide_sign_up').click(function(){
$(".show_hide_sign_up").slideUp().show();
$("#divSignUp").slideUp.show();
/*---hides the sign in form--*/
$("#divSignIn").hide();
/*---hides the sign in form--*/
});
/*--cancel button--*/
$('.hideCancel2').click(function(){
$("#divSignUp").hide().slideDown();
});
/*--cancel button--*/
});;
$(document).ready(function(e) {
$("#divSignIn").hide();
$('.show_hide_sign_in').click(function(){
$(".show_hide_sign_in").slideUp().show();
$("#divSignIn").slideUp.show();
/*---hides the sign in form--*/
$("#divSignUp").hide();
/*---hides the sign in form--*/
});
/*--cancel button--*/
$('.hideCancel').click(function(){
$("#divSignIn").hide().slideDown();
});
/*--cancel button--*/
});;
/*sign up href sliding down*/
$(document).ready(function(e) {
$("#divSignUp").hide();
$('.show_hide_sign_up').click(function(){
$(".show_hide_sign_up").slideUp().show();
$("#divSignUp").slideUp.show();
/*---hides the sign in form--*/
$("#divSignIn").hide();
/*---hides the sign in form--*/
});
/*--cancel button--*/
$('.hideCancel2').click(function(){
$("#divSignUp").hide().slideDown();
});
/*--cancel button--*/
});;
$(document).ready(function(e) {
$("#divSignIn").hide();
$('.show_hide_sign_in').click(function(){
$(".show_hide_sign_in").slideUp().show();
$("#divSignIn").slideUp.show();
/*---hides the sign in form--*/
$("#divSignUp").hide();
/*---hides the sign in form--*/
});
/*--cancel button--*/
$('.hideCancel').click(function(){
$("#divSignIn").hide().slideDown();
});
/*--cancel button--*/
});;
/*sign up href sliding down*/
$(document).ready(function(e) {
$("#divSignUp").hide();
$('.show_hide_sign_up').click(function(){
$(".show_hide_sign_up").slideUp().show();
$("#divSignUp").slideUp.show();
/*---hides the sign in form--*/
$("#divSignIn").hide();
/*---hides the sign in form--*/
});
/*--cancel button--*/
$('.hideCancel2').click(function(){
$("#divSignUp").hide().slideDown();
});
/*--cancel button--*/
});;
$(document).ready(function(e) {
$("#divSignUp").hide();
$('.show_hide_sign_up').click(function(){
$(".show_hide_sign_up").slideUp().show();
$("#divSignUp").slideUp.show();
/*---hides the sign in form--*/
$("#divSignIn").hide();
/*---hides the sign in form--*/
});
/*--cancel button--*/
$('.hideCancel2').click(function(){
$("#divSignUp").hide().slideDown();
});
/*--cancel button--*/
});;