0
問題は、ナビゲーションバーの項目をクリックするたびにポップアップが開きます。その項目にリンク「＃」がある場合。 と私がしたいのは、ポップアップは "ログイン/サインアップ"項目のみを開く必要があります。 はここにあなたがここでそれを確認することができ、実際のcodepenバージョンのllinkです：事前にclick here or go to https://codepen.io/codyhouse/pen/pIrbgポップアップをクリックすると、何かが表示されます。
jQuery(document).ready(function($) {
var $form_modal = $('.cd-user-modal'),
$form_login = $form_modal.find('#cd-login'),
$form_signup = $form_modal.find('#cd-signup'),
$form_forgot_password = $form_modal.find('#cd-reset-password'),
$form_modal_tab = $('.cd-switcher'),
$tab_login = $form_modal_tab.children('li').eq(0).children('a'),
$tab_signup = $form_modal_tab.children('li').eq(1).children('a'),
$forgot_password_link = $form_login.find('.cd-form-bottom-message a'),
$back_to_login_link = $form_forgot_password.find('.cd-form-bottom-message a'),
$main_nav = $('.hmodal');
//open modal
$main_nav.on('click', function(event) {
if ($(event.target).is($main_nav)) {
// on mobile open the submenu
$(this).children('ul').toggleClass('is-visible');
} else {
// on mobile close submenu
$main_nav.children('ul').removeClass('is-visible');
//show modal layer
$form_modal.addClass('is-visible');
//show the selected form
($(event.target).is('.cd-signup')) ? signup_selected(): login_selected();
}
});
//close modal
$('.cd-user-modal').on('click', function(event) {
if ($(event.target).is($form_modal) || $(event.target).is('.cd-close-form')) {
$form_modal.removeClass('is-visible');
}
});
//close modal when clicking the esc keyboard button
$(document).keyup(function(event) {
if (event.which == '27') {
$form_modal.removeClass('is-visible');
}
});
//switch from a tab to another
$form_modal_tab.on('click', function(event) {
event.preventDefault();
($(event.target).is($tab_login)) ? login_selected(): signup_selected();
});
//hide or show password
$('.hide-password').on('click', function() {
var $this = $(this),
$password_field = $this.prev('input');
('password' == $password_field.attr('type')) ? $password_field.attr('type', 'text'): $password_field.attr('type', 'password');
('Hide' == $this.text()) ? $this.text('Show'): $this.text('Hide');
//focus and move cursor to the end of input field
$password_field.putCursorAtEnd();
});
//show forgot-password form
$forgot_password_link.on('click', function(event) {
event.preventDefault();
forgot_password_selected();
});
//back to login from the forgot-password form
$back_to_login_link.on('click', function(event) {
event.preventDefault();
login_selected();
});
function login_selected() {
$form_login.addClass('is-selected');
$form_signup.removeClass('is-selected');
$form_forgot_password.removeClass('is-selected');
$tab_login.addClass('selected');
$tab_signup.removeClass('selected');
}
function signup_selected() {
$form_login.removeClass('is-selected');
$form_signup.addClass('is-selected');
$form_forgot_password.removeClass('is-selected');
$tab_login.removeClass('selected');
$tab_signup.addClass('selected');
}
function forgot_password_selected() {
$form_login.removeClass('is-selected');
$form_signup.removeClass('is-selected');
$form_forgot_password.addClass('is-selected');
}
//REMOVE THIS - it's just to show error messages
$form_login.find('input[type="submit"]').on('click', function(event) {
event.preventDefault();
$form_login.find('input[type="email"]').toggleClass('has-error').next('span').toggleClass('is-visible');
});
$form_signup.find('input[type="submit"]').on('click', function(event) {
event.preventDefault();
$form_signup.find('input[type="email"]').toggleClass('has-error').next('span').toggleClass('is-visible');
});
//IE9 placeholder fallback
if (!Modernizr.input.placeholder) {
$('[placeholder]').focus(function() {
var input = $(this);
if (input.val() == input.attr('placeholder')) {
input.val('');
}
}).blur(function() {
var input = $(this);
if (input.val() == '' || input.val() == input.attr('placeholder')) {
input.val(input.attr('placeholder'));
}
}).blur();
$('[placeholder]').parents('form').submit(function() {
$(this).find('[placeholder]').each(function() {
var input = $(this);
if (input.val() == input.attr('placeholder')) {
input.val('');
}
})
});
}
});
jQuery.fn.putCursorAtEnd = function() {
return this.each(function() {
// If this function exists...
if (this.setSelectionRange) {
// ... then use it (Doesn't work in IE)
// Double the length because Opera is inconsistent about whether a carriage return is one character or two. Sigh.
var len = $(this).val().length * 2;
this.setSelectionRange(len, len);
} else {
// ... otherwise replace the contents with itself
// (Doesn't work in Google Chrome)
$(this).val($(this).val());
}
});
};<!-- Fixed navbar -->
<nav id="home" class="navbar navbar-custom navbar-fixed-top" role="navigation">
<div>
<div class="navbar-header page-scroll">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-main-collapse">
<i class="fa fa-bars"></i>
</button>
<a class="navbar-brand" href="index.html">
<img class="img-responsive" alt="logo" src="img/logo.png">
</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse navbar-right navbar-main-collapse hmodal">
<ul class="nav navbar-nav" style="padding-right:15px;">
<li><button class="ui inverted compact small yellow button" style="margin-top:8px; ">Become a Partner</button></li>
<li class="active"><a href="#">Track</a></li>
<li><a href="tel:+917878000666" rel="nofollow"><i class="fa fa-phone"></i>Call +91 7878 000 666</a></li>
<li><a href="#notification"><i class="fa fa-bell" aria-hidden="true"></i></a></li>
<li><a class="cd-signin" href="#Login">Login/Signup</a></li>
<li><a href="#"><i class="fa fa-map-marker" aria-hidden="true"></i> Location</a>
<div class="dialog" style="display:none">
<div class="title">Add Event</div>
<form action="#" method="post">
<input type="submit" value="Ok"/>
</form></li>
</ul>
</div>
<!-- /.navbar-collapse -->
</div>
<!-- /.container -->
</nav>おかげで、私は2日間ここにこだわっています。私を助けてください。