0
Ich bin auf einem Chromebook und kann auf meiner Webseite nicht blättern. Ich habe kein anderes Gerät, um es zu testen, vielleicht ist es nur das Chromebook. Mein Code ist unten. Klicken Sie auf die Schaltfläche Kontakt, an der sich das Problem befindet. Möglicherweise müssen Sie den Code in Ihrem Editor kopieren und einfügen, da die Vorschau auf SO klein ist.Warum kann ich nicht auf meiner Webseite scrollen?
function contact_anim() {
$('#links-div').fadeOut('slow', function() {
$("#contact-form").fadeIn();
});
}
function cancel_contact_anim() {
$('#contact-form').fadeOut('slow', function() {
$('#links-div').fadeIn();
});
}body {
background-image: url('amsterdam1920x1080.jpg');
background-size: auto;
margin: 0;
padding: 0;
font-family: Arial;
text-align: center;
color: white;
background-attachment: fixed;
}
#main {
width: 100%;
height: 100%;
position: fixed;
background-color: rgba(252, 0, 0, 0.67);
}
#links-div {
margin: 50px;
}
.links {
text-decoration: none;
color: white;
font-weight: bold;
border: 8px solid white;
padding: 13px;
font-size: 22px;
display: block;
border-radius: 50px;
width: 170px;
margin: 0 auto;
}
h1 {
font-size: 50px;
}
p {
font-size: 27px;
}
.links:hover {
background-color: white;
}
input[type="text"], #msg {
width: 50%;
margin: 15px;
height: 40px;
resize: none;
border: none;
border-radius: 20px;
padding-left: 10px;
padding-right: 10px;
outline: none;
font-size: 20px;
}
#msg {
height: 225px;
}
#contact-form {
width: 50%;
margin: 0 auto;
}<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>j0rdan.me</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<div id="main">
<h1>j0rdan.me</h1>
<p>This site is currently in the making, but<br>feel free to take a look around</p>
<div id="links-div">
<a href="#" id="about" class="links">ABOUT ME</a><br/><br/>
<a href="#" id="contact" class="links" onclick="contact_anim()">CONTACT ME</a><br/><br/>
<a href="#" id="projects" class="links">MY PROJECTS</a><br/><br/>
</div>
<form id="contact-form" action="contact.php" method="post" style="display: none">
<input type="text" id="name" placeholder="Name"><br/>
<input type="text" id="email" placeholder="Email"><br/>
<textarea id="msg"></textarea><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<button type="submit" id="send" name="send">Send</button>
</form>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js" charset="utf-8"></script>
<script src="animation_handlers.js" charset="utf-8"></script>
</body>
</html>
Sie eine codepen erstellen und einen Link auf die Frage stellen. – RBCunhaDesign