Verstehe nur Bahnhof: Ich sehe nur links dieses hellbaue Herz und ganz rechts dieses Anmerkungssymbol, was hier im Forum "Abo verwalten" ist.
Aber mal in's Blaue geraten: Meinst Du dies:
function show(e) {
e.preventDefault()
var value = $(this).val();
alert(value);
}Und wenn Du HTML postest, solltest Du besser das generierte HTML posten, das die Quelltextansicht des Browsers anzeigt.
Wenn Du ein GIF erstellst, kannst Du festlegen, ob es nur einmal abgespielt wird oder wiederholt. Wie das geht, hängt von dem Programm ab, mit dem Du es erstellst.
Das Problem ist wohl, dass sich hier keiner mit diesem Captivate auskennt. Den Fenster für das Javascript hast Du ja schon gefunden. Du musst in der Doku nachlesen und heraus finden:
Ja, die Beschreibung in dem Link ist etwas dürftig. Als Einstieg ist vielleicht dieses besser geeignet:
<div><img src=....> ?
Nein, wie ich schon schrieb, sind es dann keine Hintergrundbilder. Lies meinen Link, dort ist beschrieben, wie es geht.
Nein, so wie Du es jetzt hast, sind es keine Hintergrundbilder. Lies hier, wie es geht:
http://wiki.selfhtml.org/wiki/CSS/Eigen…ben_und_-bilder
Du wirst background-image, background-position und background-repeat brauchen.
Diese Funktion sollte die Punktezahl berechnen, voraus gesetzt, ich habe dich richtig verstanden:
function getScore(value) {
var lowerLimit = 75, upperLimit = 80,
maxValue = 100; maxScore = 10;
if (value < lowerLimit) factor = value / lowerLimit;
else if (value > upperLimit) factor = (maxValue - value) / (maxValue - upperLimit);
else factor = 1;
return maxScore * factor;
}Demo zum Testen:
Antwort: <input id="myinput" onchange="calcScore(this.value);"> Punkte: <span id="result"></span>
<script>
function getScore(value) {
var lowerLimit = 75, upperLimit = 80,
maxValue = 100, maxScore = 10;
if (value < lowerLimit) factor = value / lowerLimit;
else if (value > upperLimit) factor = (maxValue - value) / (maxValue - upperLimit);
else factor = 1;
return maxScore * factor;
}
function calcScore(value) {
document.getElementById("result").textContent = getScore(value);
}
</script>Ist dieses Thema nicht das gleiche wie hier????
Kennt ihr außer Flexbox und Float noch andere möglichkeiten, mit denen man die 3 Absätze von oben nebeneinander stellen kann? Mit dem Code von oben sind die ja untereinander
Dass sie untereinander angeordnet werden liegt daran, dass es p-Elemente sind, diese belegen standardmäßig eine neue Zeile. Inline-Elemente wie img oder span werden dagegen standardmäßig nebeneinander angeordnet. Du kannst es testen, indem Du entweder den Tagnamen in span änderst oder den Elementen ein display:inline oder display:inline-block gibst. Womit wir bei einer dritten Möglichkeit wären, Elemente nebeneinander anzuordnen.
Ich empfehle, der Option mit flex Priorität zu geben, weil man dann viele Möglichkeiten hat, die Elemente anzuordnen und festzulegen, wie sie den Platz füllen.
h1 und h2 sind Tagnamen und keine IDs, daher musst Du das führende # weg lassen:
h1 {
font-weight: bold;
}
h2 {
font-weight: lighter;
}die jeder eine andere Nationalität haben können.Ist kein Problem mit meinem Code. Sieh dir meinen Screenshot an und probiere es aus!
Wenn ich dich nicht vollkommen falsch verstehe, sollte das kein Problem sein: Die Liste stellt den Vorrat an Nationalitäten zur Verfügung und ich habe angenommen, dass dieser bei allen drei Input-Feldern gleich ist. Dieses funtioniert jedenfalls:
<script>
$(function () {
var availableNationalityText = [
"afghanisch", "ägyptisch", "albanisch", "deutsch", "zentralafrikanisch", "zyprisch"
];
$(".NationalityText").autocomplete({
source: availableNationalityText
});
});
</script>
<input class="NationalityText">Nationalität 1<br>
<input class="NationalityText">Nationalität 2<br>
<input class="NationalityText">Nationalität 3<br>Das Array brauchst Du nur einmal, es ist für alle drei Inputs gültig. Am besten das "G3" aus dem Namen löschen, damit es klar ist.
Ist das jQuery-UI-Autocomplete? Sollte funktionieren, wenn Du den drei Feldern die selbe Klasse gibst und damit Autocomplete aufrufst:
$( function() {
var availableG3NationalityText = [
"afghanisch", "ägyptisch", "albanisch", "...................", "zentralafrikanisch", "zyprisch"
];
$( ".NationalityText" ).autocomplete({
source: availableG3NationalityText
});
});Nur was soll dann der Schwachsinn, diesen Tag 3 mal zu wiederholen..
??? Ein längerer Text kann ohne weiteres aus mehreren Absätzen bestehen. Was soll daran verkehrt sein?
Und "Absatz" ist bloß die Übersetzung von "paragraph" - was soll gegen die Verwendung sprechen? SelfHTML benutzt den Betriff auch:
Du musst beim uncheck prüfen, ob die Checkbox zu dem Button gehört, der gedrückt wurde, z. B. so:
function uncheck(event) {
var element = event.target;
var val = element.textContent.replace(/ x$/, "");
console.log(element.textContent, val);
var de = document.getElementById('text');
if (de != element) {
var uncheck = document.getElementsByTagName('input');
for (var i = 0; i < uncheck.length; i++) {
if (uncheck[i].type == 'checkbox' && uncheck[i].value == val) {
uncheck[i].checked = false;
}
}
}Es ist eine kleine Fotografie, die im Seitenheader ganz am Rand dargestellt wird. Großartig skaliert wird die nicht.
Für Fotografien ist SVG überhaupt nicht geeignet und wenn auch die Skalierbarkeit nicht relevant ist, macht es keinen Sinn, in diesem Fall SVG zu verwenden. Sinnvoll wäre es nur, wenn es sich bei dem Logo um eine Grafik mit klaren Konturen handelt, die gleich als Vektorgrafik erzeugt worden wäre.
Ja. Der Effekt des Includierens ist, als ob Du den Text von z. B. header.html kopierst (in die Zwischenablage) und auf der betr. Seite (z. B. index.php) einfügst. Wenn der Text beim Browser ankommt, ist vom include nichts mehr zu sehen, auch nicht für eine Suchmaschine, die den Text analysiert, und das Javascript und CSS aus dem head-Tag wirkt ebenfalls auf die includierten Teile.
Meine Empfehlungen:
Semantische Tags verwenden, also <header> statt <div id="header">, <nav> statt <div id="navbar">, so wie von Basti empfohlen.
Auf iFrame verzichten, er hat den Nachteil, dass sich die Größe zunächst nicht an den Inhalt anpasst und zusätzliche Tricks mit Javascript erfordert.
Dann für jede Seite eine einzelne Datei anlegen und die Teile, die auf allen Seiten gleich sind, mit PHP-include einziehen. Also
index.php:
<!DOCTYPE html>
<html>
<head>
<title>...</title>
<meta charset="utf-8" />
<meta name="description" content="..." />
<meta name="Keywords" content="..." />
<link rel="stylesheet" type="text/css" href="style.css" />
<script type="text/javascript" src="javascript.js"></script>
</head>
<body>
<?php include("header.html"); ?>
<main>
Hier die Inhalte der Hauptseite
</main>
<?php include("footer.html"); ?>
</body>
</html>header.html:
<header>
<div id="logo">
<img src="img\logo.header.jpg" />
</div>
<div id="res_btn" onclick="show_hide_nav('navbar')">
<img src="img\button.png" />
</div>
<nav>
<ul>
<li>
<a href="index.php">Home</a>
</li>
<li>
<a href="1.php">1</a>
</li>
<li>
<a href="2.php">2</a>
</li>
<li>
<a href="3.php">3</a>
</li>
<li>
<a href="4.php">4</a>
</li>
<li>
<a href="impressum.php">Impressum</a>
</li>
</ul>
</nav>
</header>1.php:
<!DOCTYPE html>
<html>
<head>
<title>...</title>
<meta charset="utf-8" />
<meta name="description" content="..." />
<meta name="Keywords" content="..." />
<link rel="stylesheet" type="text/css" href="style.css" />
<script type="text/javascript" src="javascript.js"></script>
</head>
<body>
<?php include("header.html"); ?>
<main>
Hier die Inhalte von Seite 1
</main>
<?php include("footer.html"); ?>
</body>
</html>usw. für den Footer und die weiteren Seiten.
Das wäre mein Vorschlag als Ausgangspunkt. Natürlich gibt es andere Möglichkeiten, wie nur eine Seite zu haben und den Main-Content mit Javascript einzuziehen.
Ich erinnere mich, das war diese Aufteilung mit den Viererboxen.
Desweiteren soll der Test vertikal mittig sein aber nicht die Überschrift die soll immer fest sein.
Und wenn ich mich richtig erinnere , hatte ich dir auch schon Mal gezeigt, wie man so eine Einteilung herstellt: Flex mit Richtung column und margin:auto für den Absatz.
Ich habe mal das CSS nur für die Konfiguration in deinem Bild ausgearbeitet:
.InfoBox {
display: flex;
height: 30vh; /* nur zum Text, damit Platz ist, um die Ausrichtung sichtbar zu machen */
border: 2px solid lightblue; /* nur zum Text */
}
.InfoBox .lteil {
flex: 3;
display: flex;
align-items: center;
justify-content: center;
}
.InfoBox .lteil img {
width: 80%;
height: auto;
}
.InfoBox .rteil {
flex: 7;
display: flex;
flex-direction: column;
}
.InfoBox .rteil h2 {
text-align: center;
}
.InfoBox .rteil p {
margin: auto;
text-align: justify;
padding-right: 0.5em;
}