• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Verweis-sensitive Grafiken definieren(Coords)

Status
Für weitere Antworten geschlossen.

Maurice

Neues Mitglied
Hallo zusammen,

ich habe die letzten Wochen mal wieder ein bisschen mit HTML bebastelt und komme bei den Coords nicht weiter. Ich habe ein screenshot von einem Programm wo unter anderem ein Button abgebildet ist. ich möchte wenn ich auf den Button im scrennshot klicke das sich ein anderer screenshot öffnet. ich weiss das man um den Button im screenshot aktiv kriegen will koordinaten von dem screnshot und vom button haben muss. Aber ich weiss nicht mehr wie man die koordinaten raubekommt. ich hoffe ihr könnt mir helfen!!
 
1. es heißt gebastelt
2. wie gesagt brauchst du dafür eine Imagemap. entweder du kriegt sie selber raus, oder du benutzt dafür ein Grafikprogramm
 
Hi Maurice

wie von asd richtig erkannt, solltest du aus dem Bild eine Imagemap machen.
LINK: http://de.selfhtml.org/html/grafiken/verweis_sensitive.htm#definieren

Die Coordinaten des Button kannst du eigentlich ganz leicht im Paint (Bestandteil von Windows) auslesen. Einfach das Bild mit Paint öffnen und mit dem Cursor an die linke obere Ecke des Button gehen, dann kannst du die Pixel in der Statuszeile ablesen.
Eine andere Möglichkeit wäre dem HTML-Tag "area" ein Border geben und dann anhand des Borders nach und nach hinschieben. :wink:

Gruß
Hobbyuser
 
Hier mal mein Code!!

HTML:
<HEAD>
<title>Datenbankmanager V1.0</title>
</HEAD>
<body>
<table><tr vAlign=top><td><A name=Top></A>
<strong><u><Font size="5">Datenbankmanager</font></u></strong></td></tr>
</table><br>
<h4>Willkommensseite</h4>
<h4>
<a name="Willkommensseite"></a><img border="0" src="testbild1.jpg" width="656" height="532"><br><b>Startseite</b><br>
<br><br><img border="0" src="testbild2.jpg" width="789" height="573"><br><br><br><br><br><br><br><br><br><br><br><br>
<a name="Willkommensseite"></a>
<map name="Willkommensseite">
<area shape="rect" coords="362,292,550,313"title="RS1" href="#604">
title="RS3" href="#601">
</map>
<img src="Testbilder/Testbild1.JPG" width="684" height="484" usemap="#Willkommensseite" border="0"><br><br>
<br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<a name="Startseite"</a>

Das ist mal der Auszug aus dem Quellcode.
Also Testbild1 ist der screenshot wo ein Button drauf abgebildet ist die rotmarkierten zahlen sind die Koordinaten von dem Button (die 1. zwei Zahlen sind die Koordinaten von links oben in der Ecke und die andernen zwei Zahlen sind die Koordinaten von unten rechts in der Ecke. So jetzt möchte ich eben wenn ich auf den Button klicke das aus dem Pfeil eine Hand wird und ich den Button anklicke und sich dann testbild2 öffnet. ich hoffe ihr könnt mir nochmal ein Tip geben. wie gesagt ich bin Programmierer aber eher in Java und .Net und HTML ist bei mir schon etwas länger her!!!
 
Zuletzt bearbeitet von einem Moderator:
ich finde es einfacher einen Transparenten, Z-Index-überlappenden div-container, der mit einem Link verbunden ist einzufügen
 
Quellcode

Kann mir nochmal einer was zu meinem Quelloce sagen ob das so richtig ist und wie das mit den Koordinaten läuft
 
infos zum qt? hier, mal 'en bissel überarbeitet, jetzt stimmt alles. (HTML 4.01 trans)

HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<HEAD>
<title>Datenbankmanager V1.0</title>
</HEAD>
<body>
<table><tr vAlign=top><td><A name=Top></A>
<strong><u><Font size="5">Datenbankmanager</font></u></strong></td></tr>
</table><br>
<h4>Willkommensseite</h4>
<a name="Willkommensseite"></a><img border="0" src="testbild1.jpg" alt="bla1" width="656" height="532"><br><b>Startseite</b><br>
<br><br><img border="0" src="testbild2.jpg" width="789" alt="bla2" height="573"><br><br><br><br><br><br><br><br><br><br><br><br>
<a name="Willkommensseite"></a>
<map name="Willkommensseite">
<area shape="rect" coords="362,292,550,313" title="RS1" href="#604" alt="bla4">
</map>
<img src="Testbilder/Testbild1.JPG" alt="bla3" width="684" height="484" usemap="#Willkommensseite" border="0"><br><br>
<br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<a name="Startseite"</a>
</body>
</html>

Nils aka XraYSoLo
 
Also mal der reduzierte HTML-Code
HTML:
<map name="Willkommensseite">
<area shape="rect" coords="362,292,550,313" title="RS1" href="#604">
</map>
 
<img src="Testbilder/Testbild1.JPG" width="684" height="484" usemap="#Willkommensseite" border="0">

Soweit stimmt das von dir schon, aber im obigen Code sind paar andere Fehler ;-)

Und wennst noch Fragen hast, schau doch bitte auf Selfhtml da sehte es wirklich sehr ausführlich erklärt.

Und zum Div - Element:
Wozu Dinge zweckentfremend, wenn schon HTML selber eine sehr gute Möglichkeit bietet (zudem ist Usemap in bestimmten Situationen sehr viel Genauer in den Kordinatenangaben)
 
Koordinaten

HTML:
<HTML>
<HEAD>
<title>Datenbankmanager</title>
</HEAD>
<body>
<table><tr vAlign=top><td><A name=Top></A>
<strong><u><Font size="5">Datenbankmanager</font></u></strong></td></tr>
</table><br><br>
<h4> Willkommensfenster</h4>
<a name="Willkommensfenster"></a>
<map name="Willkommensfenster">
<area shape="rect" coords="700,820,500,590" title="RS1" href="#602">
</map>
<img src="Testbilder/Testbild1.JPG" width="1200" height="1000" usemap="#Willkommensfenster" border="0">
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<a name="Passworteingabe"></a>
<img src="Testbilder/Testbild2" width="800" height="600" usemap="#Passworteingabe" border="0">
<br><br><br><br><br><br><br><br><br><br><br><br><br>

so der Cursor(RS1) liegt jetzt auf dem Button aber wie bekomme ich jetzt mit dem Handcursor das so hin das sich das nächste bild(testbild2) öffent mit einer click Funktion oder wie?
 
Zuletzt bearbeitet von einem Moderator:
indem du diese Zeile

HTML:
<area shape="rect" coords="700,820,500,590" title="RS1" href="#602">
wie folgt änderst:
HTML:
 <area shape="rect" coords="700,820,500,590" title="RS1" href="Testbilder/Testbild2.JPG">
 
Status
Für weitere Antworten geschlossen.
Zurück
Oben