Commit aa938892 authored by Shadow Chrome's avatar Shadow Chrome
Browse files

Einsendeaufgabe 2

parent 5aee0de9
......@@ -6,15 +6,16 @@
<meta name="description" content="Internettechnologie - Client - Server Einsendeaufgabe von Marcel Koschau"/>
<meta name="author" content="Marcel Koschau"/>
<link rel="stylesheet" href="./css/style.css"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
</head>
<body>
<body onload = "startTimer()">
<header>
<div class="menu">
<h1 class="header-text">Fuyumi 'Shiro' Bigfoot von Pleissengrund</h1>
<nav class="shift">
<ul>
<li><a href="#facts">Fakten</a></li>
<li><a href="#comment">Gästebuch</a></li>
<li><a href="#comment" onclick="toggleCommentSection()">Gästebuch</a></li>
<li><a href="#about">Über</a></li>
</ul>
</nav>
......@@ -24,7 +25,7 @@
<div id="facts">
<div class="wrapper">
<div class="left">
<img src="images/shiro_fakten.jpg" alt="user" width="100">
<img id="img" src="images/shiro_fakten_1.jpg" alt="user" width="150">
<h4>Fuyumi 'Shiro' Bigfoot von Pleissengrund</h4>
<p>Samojede</p>
</div>
......@@ -73,19 +74,21 @@
<label for="comment1">Kommentar von Max Mustermann:</label>
<textarea id="comment1" name="comment1"
rows="5" cols="33">
rows="5" cols="33" onkeyup="countCharInTextArea(this, '#comment1Char')">
So ein schöner Hund!
</textarea>
<div id="comment1Char"></div>
</div>
<div style="margin: 12px">
<label for="comment2">Kommentar von Julia Müller:</label>
<textarea id="comment2" name="comment2"
rows="5" cols="33">
rows="5" cols="33" onkeyup="countCharInTextArea(this, '#comment2Char')">
Das Fell muss bestimmt jeden Tag gepflegt werden...
</textarea>
</div>
<div id="comment2Char"></div>
</div>
</div>
</div>
</div>
......
var images = [], x = -1;
images[0] = "images/shiro_fakten_1.jpg";
images[1] = "images/shiro_fakten_2.jpg";
images[2] = "images/shiro_fakten_3.jpg";
function displayNextImage() {
x = (x === images.length - 1) ? 0 : x + 1;
document.getElementById("img").src = images[x];
}
function displayPreviousImage() {
x = (x <= 0) ? images.length - 1 : x - 1;
document.getElementById("img").src = images[x];
}
function startTimer() {
setInterval(displayNextImage, 2000);
}
function toggleCommentSection() {
var x = document.getElementById("comment");
if (x.style.display === "none") {
x.style.display = "block";
} else {
x.style.display = "none";
}
}
function countCharInTextArea(val, id) {
var len = val.value.length;
if (len >= 500) {
val.value = val.value.substring(0, 500);
}
$(id).text(500 - len);
}
\ No newline at end of file
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment