verweis-sensitive Grafiken

Slides:



Advertisements
Ähnliche Präsentationen
Freie Universität Berlin Institut für Informatik
Advertisements

Steigung m berechnen Man kann die Steigung auch berechnen,
Tipps & Tricks zu benutzerdefinierten Animationspfaden
Image Mapping1 Erstellung von Klicksensitiven Grafiken Für Webseiten.
Markus Tank, Wie arbeitet man mit dem Rich Text Editor?
Zeichnen für Anfänger -für das Zeichnen benutzten wir das Programm „Autosketch“ Dafür gehen wir in das Startmenü, dann auf Programm und danach auf Autosketch.
HTML - Einführung Richard Göbel.
FH-Hof Einbindung von JavaScript Anweisungen
FH-Hof Extensible Markup Language Richard Göbel. FH-Hof Extensible Markup Language XML XML ist universeller Ansatz für die Strukturierung von Zeichenketten.
Suchmaschine vs. Katalog Such-Robots i.d.R. werden alle Seiten erfasst täglich werden mehrere Mio. Seiten besucht Redaktion relativ wenig Seiten erfasst.
HTML - Eine erste Annäherung
Cascading Style Sheets
Benutzen von Internetseiten
Modularization of XHTML™
Überblick XML: Extensible Markup Language Entwickelt, um Informationen bereitzustellen, zu speichern und zu übertragen Im Gegensatz zu HTML keine vordefinierten.
By Monika Krolak & Christian Meschke
Web-GIS und Multimedia
Java-Kurs - 7. Übung Besprechung der Hausaufgabe Referenzvariablen
Programmieren mit JAVA Teil V. Grafikausgabe mit JAVA, das AWT Java wurde von Anfang an mit dem Anspruch entwickelt, ein vielseitiges, aber einfach zu.
Lies genau und mach Dir ein Bild!
Computergrafik Vom Dreieck zum Ego-Shooter Olaf Müller
Imagemaps & Animierte GIF-Grafiken
Marcus Haller & René Schulze
Estellen eines Sechskantes mit Abschrägung und Durchbruch
Computerkurs 1.
Was versteht man unter XML Schema?
FH-Hof HTML - Einführung Richard Göbel. FH-Hof Komponenten des World Wide Webs WWW Browser HyperText Transfer Protocol (HTTP) via Internet WWW Server.
Kundenspezifische Anpassungen - Ändern von Objekten
Prof. Dr. Gerhard Schmidt pres. by H.-J. Steffens Software Engineering SS 2009Folie 1 Objektmodellierung Objekte und Klassen Ein Objekt ist ein Exemplar.
Einführung in das Programmieren mit JavaScript Mag. Andreas Starzer weloveIT – EDV Dienstleistungen.
Anlegen von Ordnern, speichern und Öffnen von Bildern und Briefen
Grafikprogrammierung
Foliengestaltung mit Power-Point (Version 10) Eine kleine Einführung
Java ohne Kara. Java ohne Kara Ab jetzt: Java ohne Kara Ziel: Erfahrungen sammeln mit ersten Java Programmen.
Hyperlinks und Anker Links notieren
Was ist ein Frame? Frames teilen Browser-Fenster in rechteckige Bereiche. Mehrere Web-Seiten können gleichzeitig angezeigt werden unabhängig voneinander.
AINF-Lehrgang PROGRAMMIEREN Martina GREILER Wolfgang KATOLNIG
Ändern von Merkmalen Geometrie Topologie Attribute.
Typo3 Templates und TypoScript
7 Bessere Übersicht mit NamenInhaltsverzeichnis 7 Bessere Übersicht mit Namen 7.1Grundlagen 7.2Namen vergeben 7.3Namen in Formeln einsetzen 7.4Nützliches.
11. Tabellen 11.1 Grundlegende Tabellenbearbeitung
Wird ganz am Anfang der HTML-Datei geschrieben Doctype html public bedeutet, dass man sich auf die Öffentlichkeit der html-dtd bezieht Html ist die meist.
Texteingabe am Cursor 3. Grundlagen der Textverarbeitung.
Tutorium zur LV Online Research Ein Computerprogramm tut, was Du schreibst, nicht was Du willst.
Chair of Software Engineering Einführung in die Programmierung Prof. Dr. Bertrand Meyer Lektion 9: Abstraktion.
1 Bildschirmpräsentation Möglichkeiten, die Präsentation einer Präsentation vorzubereiten und durchzuführen.
Schnelleinstieg - Demonstrationsszenario für Part Design
110 Bessere Übersicht mit NamenInhalt 10Bessere Übersicht mit Namen 10.1Die Namensvergabe 10.2Namen in Formeln einsetzen 10.3Nützliches zu Namen.
4. Weiterführende Textgestaltung
Visual Design mit Processing Übung Visualisierung semantischer Information.
Wie stelle ich einen Blog in Wikispaces?. Den Internet – Link, unter welchem der Blog zu finden ist kopieren.
Den Internet – Link, unter welchem der Blog zu finden ist kopieren.
Wie erstelle ich eine einfache, weihnachtliche Menükarte
So kannst du den Computer steuern !
Vortrag: Frames & Javascript.
Materialien zur Fortbildungsreihe C für die Informatik in SII
Hypertext Markup Language
Programmiervorkurs WS 2014/15 Instanzmethoden
„Erstellen“ anklicken. sonstige Reparaturen und Dienstleistungen anklicken.
Funktionsumfang und Funktionsweise.  Internetbasierte Anwendung  Anzeige von Positionen, Routen, Stops  Verwaltung und Konfiguration von Trackern 
document document Hier wird das document Objekt definiert. Alle anderen Objekte sind innerhalb des Objektes document angesiedelt. In diesem „rohen“ Dokument.
HTML Hypertext Markup Language
TUDWCMS Wie kann der Autor eines Dokumentes geändert werden ?
Webserver einrichten mit Konfiguration, online stellen, Zugang © by Lars Koschinski 2003.
(Syntax, Strings/Zahlen, Variablen, Arrays)
UNSERER HOMEPAGE Anleitung zur Registrierung europa.eu Stand
Einführung in die Informatik
Wie erstelle ich eine einfache, weihnachtliche Menükarte
Variable Beim Ausschalten gehen alle in den Variablen gespeicherten Informationen verloren! Zweck: Speichern von Informationen, z. B. Zahlen Modellvorstellung:
Microsoft Excel Funktion Namen Excel: Funktion Namen.
 Präsentation transkript:

verweis-sensitive Grafiken Verweis-sensitive Grafiken sind Grafiken, in denen der Anwender mit der Maus auf ein Detail klicken kann. Daraufhin wird ein Verweis ausgeführt. Auf diese Weise kann der Anwender in einigen Fällen wesentlich intuitiver und schneller zu Information gelangen als durch lange verbale Verweislisten.

Quelltext

<MAP> Mit <map name="[Name]"> leiten Sie die Definition der verweis-sensitiven Flächen einer Grafik ein. Beim name-Attribut vergeben Sie einen Namen für die verweis-sensitive Grafik. Dieser Name muss nichts mit dem Dateinamen der Grafik zu tun haben. Vergeben Sie keine zu langen Namen. Namen dürfen keine Leerzeichen und keine deutschen Umlaute enthalten. Das erste Zeichen muss ein Buchstabe sein. Danach sind auch Ziffern erlaubt. Benutzen Sie als Sonderzeichen im Namen höchstens den Unterstrich (_), den Bindestrich (-), den Doppelpunkt (:) oder den Punkt (.).

Zwischen dem einleitenden <map...> und dem abschließenden </map> definieren Sie die verweis- sensitiven Flächen. Mit <area...> definieren Sie einzelne verweis-sensitive Flächen einer bestimmten Grafik, die Sie an einer anderen Stelle einbinden.

Ein Viereck (shape="rect") definieren Sie mit den Koordinaten für x1,y1,x2,y2 wobei bedeuten: x1 = linke obere Ecke, Pixel von links y1 = linke obere Ecke, Pixel von oben x2 = rechte untere Ecke, Pixel von links y2 = rechte untere Ecke, Pixel von oben

Einen Kreis (shape="circle") definieren Sie mit den Koordinaten für x,y,r wobei bedeuten: x = Mittelpunkt, Pixel von links y = Mittelpunkt, Pixel von oben r = Radius in Pixel

Ein Polygon (shape="poly") definieren Sie mit den Koordinaten x1,y1,x2,y2 ... xn,yn wobei bedeuten: x = Pixel einer Ecke von links y = Pixel einer Ecke von oben Sie können so viele Ecken definieren wie Sie wollen. Von der letzten definierten Ecke müssen Sie sich eine Linie zur ersten definierten Ecke hinzudenken. Diese schließt das Polygon.

Mit dem <alt>-Attribut notieren Sie Alternativtext für den Fall, dass die verweis-sensitive Fläche nicht angezeigt werden kann. Dieses Attribut ist ein Pflichtattribut, d.h. Sie müssen es notieren, um gültiges HTML zu erzeugen. Den Text den mal als Wert in das <alt>-Attribut einfügt, wird in einem kleinen gelben Fenster neben dem Mauszeiger angezeigt, wenn man mit der Maus über dem Bereich ist.

Kleiner Javascript Sie können durch einen kleinen Javascript eine Fehlermeldung erzeugen, die beim klicken auf einen Bereich erscheint. Sie können den Text der Fehlermeldung frei definieren.

Der Javascript <script language=javascript> function fehlermeldung() {alert(„Text, der angezeigt werden soll") } </script> Dieser Javascript wird in den <HEAD> teil des HTML Dokuments eingefügt.

Verweis auf Javascript Man definiert genauso einen Bereich, wie zuvor. <map name="[Name des Bildes, gleich wie im <img>]"> <area shape="[rect | circle | poly]" coords="[Koordianten durch [,] abgetrennt]" alt="[Beschriebung]„ onClick=„fehlermeldung()“> </map> <img src="[Bildname]" alt="[Beschriebung]" usemap="#[Name des Bildes]"> Fügt jedoch in den <area> TAG das Attribut onClick=„Name der Funktion()“ ein.

© Made by Michael Klenk ®