Przycisk navbar od menu w telefonie na stronie Contakt nie rozwija się. Na innych działa. Strona Contact jest inaczej zrobiona ze względu na dodany formularz e-mail z załącznikiem. Nawet js jest razem z html. Długo walczyłem aby w ogóle ten formularz mi zadziałał z załącznikiem i dlatego jest tak, a nie inaczej, tylko te menu na małych urządzeniach nie chce działać niestety. Wklejam kod i poproszę o podpowiedzi. Dzięki
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title> Elite Business Club333 </title>
<meta name="description" content="Advertising, Announcements for Business, Companies, Offices, Shops, Services ">
<meta name="keywords" content=" UK, Announcements, Advertising ">
<meta name="author" content=" ">
<meta http-equiv="X-Ua-Compatible" content="IE=edge">
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="main.css">
<link href="https://fonts.googleapis.com/css?family=Open+Sans:400,500,700&subset=latin-ext" rel="stylesheet">
<!--[if lt IE 9]>
<script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.min.js"></script>
<![endif]-->
<script async custom-element="amp-ad" src="https://cdn.ampproject.org/v0/amp-ad-0.1.js"></script>
</head>
<body background="http://elite-business-club333.co.uk/img/ebc333.jpg">
<header>
<nav class="navbar navbar-dark navbar-expand-lg" style="background-color: clear;">
<a class="navbar-brand" href="https://elite-business-club333.co.uk"><img src="/img/ebc333.png" width="25" height="25" class="d-inline-block mr-1 align-bottom" alt=""><font color="ffd700">Elite Business Club333</font></a>
<a class="navbar-brand" href="https://elite-business-club333.co.uk" class="d-inline-block mr-1 align-bottom" alt=" "><font color="ffd700"> </font></a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#mainmenu" aria-controls="mainmenu" aria-expanded="false" aria-label="Przełącznik nawigacji">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse justify-content-end" id="mainmenu">
<ul class="navbar-nav">
<li class="nav-item active">
<a class="nav-link" href="https://elite-business-club333.co.uk"> Home </a>
</li>
<li class="nav-item active">
<a class="nav-link" href="/spacecraft"> Spacecraft </a>
</li>
<li class="nav-item active">
<a class="nav-link" href="/our-store"> Our Store </a>
</li>
<li class="nav-item active">
<a class="nav-link" href="/contact"> Contact </a>
</li>
</ul>
</div>
</nav>
</header>
<div class="container">
<div class="row">
<div class="col-xl-8 offset-xl-2 py-5">
<div class="form-style" id="contact_form">
<div class="form-style-heading">Please Contact Us</div>
<form id="contact_body" method="post" action="contact_me.php" role="form">
<div class="messages"></div>
<div class="controls">
<div class="row">
<div class="col-md-6">
<div class="form-group">
<label for="name">Name *</label>
<input id="name" type="text" name="name" class="form-control" placeholder="Your name *" required="required" data-required="true"/>
<div class="help-block with-errors"></div>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label for="email">Email *</label>
<input id="email" type="email" name="email" class="form-control" placeholder="Your email *" required="required" data-required="true"/>
<div class="help-block with-errors"></div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<div class="form-group">
<label for="subject">Please specify your need *</label>
<select id="subject" name="subject" class="form-control" required="required" data-error="Please specify your need.">
<option value="General Question"></option>
<option value="Request quotation">Order a spot</option>
<option value="Request order status">Request copy of an invoice</option>
<option value="Request copy of an invoice">Suggestions and comments</option>
<option value="Other">Other</option>
</select>
<div class="help-block with-errors"></div>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label for="form_file">Attachment</label>
<input id="form_file" file class="form-control" placeholder="CV" type="file" name="file_attach[]" multiple/>
<div class="help-block with-errors"></div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="form-group">
<label for="message">Message</label><span class="required">*</span></span>
<textarea id="message" name="message" class="form-control" placeholder="Enter your message text. *" data-required="true" required="required" data-error="Please,leave us a message."></textarea>
<div class="help-block with-errors"></div>
</div>
</div>
<div class="col-md-12">
<div id="contact_results"></div>
<input type="submit" class="btn btn-success btn-send" value="Send message">
</div>
</div>
<div class="row">
<div class="col-md-12">
<p class="text-muted"><strong>*</strong> Required fields </p>
</div>
</div>
</div>
</form>
<div id="contact_results"></div>
</div>
</div>
<!-- /.8 -->
</div>
<!-- /.row-->
</div>
<!-- /.container-->
<footer class="dark-bg" style="margin-top:0px; padding-top: 20px;">
<div class="container">
<div class="row" style="margin-top:0px; margin-bottom:10px">
<div class="col-xs-12 col-sm-6 col-md-3">
<p> <a href="http://elite-business-club333.co.uk">EBC333 </a></p>
<p><a href="/contact"> Contact </a></p>
</div>
<div class="col-xs-12 col-sm-6 col-md-3">
<p><a href="/our-company"> Our Company </a></p>
<p><a href="/privacy-policy">Privacy Policy</a></p>
</div>
<div class="col-xs-12 col-sm-6 col-md-3">
<p><a href="/terms-and-conditions"> Terms & Conditions </a></p>
<p><a href="/disclaimer"> Disclaimer </a></p>
</div>
<div class="col-xs-12 col-sm-6 col-md-3">
<a class="navbar-brand" href="https://elite-business-club333.co.uk"><img src="/img/ebc333-facebook.png" width="25" height="25" class="d-inline-block mr-1 align-bottom" alt=""></a>
<a class="navbar-brand" href="https://elite-business-club333.co.uk"><img src="/img/ebc333-twitter.png" width="25" height="25" class="d-inline-block mr-1 align-bottom" alt=""></a>
<a class="navbar-brand" href="https://elite-business-club333.co.uk"><img src="/img/ebc333-instagram.png" width="24" height="24" class="d-inline-block mr-1 align-bottom" alt=""></a>
</div>
<div class="col-sm-2 col-lg-12">
<hr class="light-100">
<p>© <a href="http://elite-business-club333.co.uk">Elite-Business-Club333.co.uk</a><p>
</hr>
</div>
</div>
</div>
</footer>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/js/bootstrap.bundle.min.js" integrity="sha384-b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0" crossorigin="anonymous"></script>
<script src="js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script type="text/javascript">
var allowed_file_size = "3145728"; //3 MB allowed file size
var allowed_file_types = ['image/png', 'image/gif', 'image/jpeg', 'image/pjpeg', 'application/x-zip-compressed', 'application/pdf']; //Allowed file types
var border_color = "#C2C2C2"; //initial input border color
var maximum_files = 2; //Maximum number of files allowed
$("#contact_body").submit(function(e){
e.preventDefault(); //prevent default action
proceed = true;
//simple input validation
$($(this).find("input[data-required=true], textarea[data-required=true]")).each(function(){
if(!$.trim($(this).val())){ //if this field is empty
$(this).css('border-color','red'); //change border color to red
proceed = false; //set do not proceed flag
}
//check invalid email
var email_reg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
if($(this).attr("type")=="email" && !email_reg.test($.trim($(this).val()))){
$(this).css('border-color','red'); //change border color to red
proceed = false; //set do not proceed flag
}
}).on("input", function(){ //change border color to original
$(this).css('border-color', border_color);
});
//check file size and type before upload, works in modern browsers
if(window.File && window.FileReader && window.FileList && window.Blob){
var total_files_size = 0;
if(this.elements['file_attach[]'].files.length > maximum_files){
alert( "Can not select more than "+maximum_files+" file(s)");
proceed = false;
}
$(this.elements['file_attach[]'].files).each(function(i, ifile){
if(ifile.value !== ""){ //continue only if file(s) are selected
if(allowed_file_types.indexOf(ifile.type) === -1){ //check unsupported file
alert( ifile.name + " is unsupported file type!");
proceed = false;
}
total_files_size = total_files_size + ifile.size; //add file size to total size
}
});
if(total_files_size > allowed_file_size){
alert( "Make sure total file size is less than 1 MB!");
proceed = false;
}
}
//if everything's ok, continue with Ajax form submit
if(proceed){
var post_url = $(this).attr("action"); //get form action url
var request_method = $(this).attr("method"); //get form GET/POST method
var form_data = new FormData(this); //Creates new FormData object
$.ajax({ //ajax form submit
url : post_url,
type: request_method,
data : form_data,
dataType : "json",
contentType: false,
cache: false,
processData:false
}).done(function(res){ //fetch server "json" messages when done
if(res.type == "error"){
$("#contact_results").html('<div class="error">'+ res.text +"</div>");
}
if(res.type == "done"){
$("#contact_results").html('<div class="success">'+ res.text +"</div>");
}
});
}
});
</script>
</body>
</html>
