Bildaustausch mit dem Attribut „name“ und zwei Funktionen Funktion um das Bild von Asterix einzusetzen.
function asterix() { document.images1.src="Bilder/Asterix.jpg"; }
Funktion um das Bild von Obelix einzusetzen.
function obelix() { document.images1.src="Bilder/Obelix.jpg"; } Ereignis mit Funktionsaufruf Ereignis mit Funktionsaufruf
Hochschule Karlsruhe Technik & Wirtschaft
Internet-Technologien T3B250
SS2014
Prof. Dipl.-Ing. Martin Schober
Bildaustausch mit dem Attribut „name“, einer Funktion und Funktion um das an die Variable „Bild“ Variablenübergabe übergebene Bild einzusetzen. function Bildtausch(Bild) { document.images1.src = Bild; }
Ereignis mit Funktionsaufruf und der Übergabe des Bildnamens.
Hochschule Karlsruhe Technik & Wirtschaft
Internet-Technologien T3B250
SS2014
Prof. Dipl.-Ing. Martin Schober
Flächen ein-/ausblenden Funktion um die function RoteFlaeche() { rote Fläche sichtbar/unsichtba if (document.getElementById("rot").style.visibility == "hidden") { document.getElementById("rot").style.visibility = "visible"; r zu machen. } else { document.getElementById("rot").style.visibility = "hidden"; Zugriff auf das Objekt per getElementById. } } function BlaueFlaeche() { Funktion um die if (document.getElementById("blau").style.visibility == "hidden") { blaue Fläche document.getElementById("blau").style.visibility = "visible"; sichtbar/unsichtbar } else { zu machen. document.getElementById("blau").style.visibility = "hidden"; } Vergabe der id. } Raum für den Inhalt von class "div1" id "cont1" Raum für den Inhalt von class "div2" id "cont2"
Textlink mit dem Ereignis onclick, um die entsprechende Funktion zu starten, die die Sichtbarkeit einstellt.
Rote Fläche sichtbar/unsichtbar Blaue Fläche sichtbar/unsichtbar
Hochschule Karlsruhe Technik & Wirtschaft
Internet-Technologien T3B250
SS2014
Prof. Dipl.-Ing. Martin Schober
Aufgabe: Ersatzteilkennzeichnung durch „mouseOver“
Hochschule Karlsruhe Technik & Wirtschaft
Internet-Technologien T3B250
SS2014
Prof. Dipl.-Ing. Martin Schober
1. Div-Tag in der HTML-Datei setzen und mit Link umschließen
Hochschule Karlsruhe Technik & Wirtschaft
Internet-Technologien T3B250
SS2014
Prof. Dipl.-Ing. Martin Schober
2. Rahmen in der CSS-Datei setzen .div1 { position: absolute; float: left; height: 20px; width: 127px; top: 601px; left: 23px; border-style: solid; border-color: #FF0000; border: none; }
Mit Transparenz arbeiten Tabelle mit Browserspezifikationen Die folgende Tabelle soll die jeweiligen CSS-Codes der Browser für Transparenz zeigen: allgemeine Eigenschaft
Internet Explorer
Webkit (z.B. Safari)
Mozilla
Opera
opacity: 0.7
filter:alpha(opacity=70)
-webkit-opacity: 0.7
-moz-opacity: 0.7
-opera-opacity: 0.7
Hierbei fällt die bereits oben beschriebene Angabe des Wertes von 1 und in 0.1er Schritten weiter runter auf. Deutlich sticht der Internet Explorer heraus, der mit dem filter:alpha und (opacity) arbeitet. Hierbei wird der Prozentwert angeben also zum Beispiel 100, 70, 50, 10, etc. Der Wert 0.7 bzw. 70 in der Tabelle ist nur exemplarisch und kann den eigenen Wünschen entsprechend von 0 bzw. 0.1 bis 1 bzw. 0 (10) bis 100 eingesetzt werden.
