XHTMLforum

XHTMLforum (http://xhtmlforum.de/index.php)
-   (X)HTML (http://xhtmlforum.de/forumdisplay.php?f=72)
-   -   Mit Java Bilder in HTML erklären. Wie gehts? (http://xhtmlforum.de/showthread.php?t=41230)

P@trick 09.08.2006 22:37

Mit Java Bilder in HTML erklären. Wie gehts?
 
Liste der Anhänge anzeigen (Anzahl: 2)
Hallo

Ich habe folgendes Problem und zwar plane ich in den HTML Code ein Java Script (oder so kenn mich mit Java leider überhaupt nicht aus!) einzubinden, welches eine erklärung abgibt wenn man über ein bestimmtes Icon fährt. Hier mal als Beispiel wie ich mir das vorstelle:

http://xhtmlforum.de/attachment.php?...1&d=1155152083

So wenn man nun mit der Maus über ein Icon fährt, im Beispiel das Haus, dann soll in der nächsten Zeile der Erkläungstext stehen. Beispiel:

http://xhtmlforum.de/attachment.php?...1&d=1155152083

Hier der HTML Code von den ersten Screenshot:

Code:

<table>
<tr>
<td><a href="$settings[bburl]/usercp.php"><img src="$theme[imgdir]/welcomeblock/usercp.gif" alt="$lang->welcome_usercp"/></a></td>
<td>$admincplink</td>
<td><a href="$settings[bburl]/member.php?action=logout&amp;uid=$mybbuser[uid]"><img src="$theme[imgdir]/welcomeblock/logout.gif" alt="$lang->welcome_logout"/></a></td>
</tr>
<tr colspan="3">
<td>>></td>
</tr>
</table>

Bitte denkt daran, dass ich keine Erfahrung mit Java hab, wenn ihr mir erklärt wie ich das machen soll... :)

heiko_rs 09.08.2006 22:54

Da die Bilder verlinkt sind, geht es sogar per CSS (das ist eh die schönere Lösung, da auch bei deaktivierten JS möglich): http://xhtmlforum.de/41078-mit-maus-...link-dann.html

P@trick 10.08.2006 01:01

danke :)

Schön das es so einfach per CSS geht. Hat IE damit probleme?

Edit: Im IE scheints nicht zu gehen. Der macht um die entsprechenden Icons nen blauen Rahmen. Kann man da irgendwas drehen, dass es doch geht?

heiko_rs 10.08.2006 01:48

Zitat:

Zitat von P@trick
Hat IE damit probleme?

Letztlich nicht (nicht einmal der IE 5.0), man muß ihn nur ggf. etwas "überlisten" (wie so oft), damit er die hover-Inhalte anzeigt. Wenn Du's im Firefox hingekriegt hast und der IE noch nichts anzeigt, poste einfach nochmal.

Zitat:

Zitat von P@trick
Im IE scheints nicht zu gehen. Der macht um die entsprechenden Icons nen blauen Rahmen.

Um die verlinkten Grafiken? Das ist default, gib ihnen (d.h. img) einfach border: none;.

P@trick 10.08.2006 01:59

Weder im IE noch im Firefox kommt der gewünschte Text mit folgenden html code:

Code:

<style type="text/css">
a span {
        display: none;
        }
       
a:hover span {
**display: block;
**position: absolute;
        left: 7%;
        top: 28%;
        }
</style>

<table>
<tr>
<td><a href="$settings[bburl]/usercp.php"><img src="$theme[imgdir]/welcomeblock/usercp.gif" alt="$lang->welcome_usercp"/>
<span>$lang->welcome_usercp</span></a></td>
<td>$admincplink</td>
<td><a href="$settings[bburl]/member.php?action=logout&amp;uid=$mybbuser[uid]"><img src="$theme[imgdir]/welcomeblock/logout.gif" alt="$lang->welcome_logout"/>
<span>$lang->welcome_logout</span></a></td>
</tr>
<tr colspan="3">
<td>>></td>
</tr>
</table>

Ansonsten stehe ich noch vor den problem, dass ich den Text gern an einer bestimmten Stelle auf der Seite hätte, diese aber wenn ich die größe des Broswer variiere sich auch mitändern soll, so dass sie genau unter den icons ist.

heiko_rs 10.08.2006 03:00

Zitat:

Zitat von P@trick
Code:

a:hover span {
**display: block;
**position: absolute;
left: 7%;
top: 28%;
}


Das rot markierte muß raus ;)

Zitat:

Zitat von P@trick
dass ich den Text gern an einer bestimmten Stelle auf der Seite hätte, diese aber wenn ich die größe des Broswer variiere sich auch mitändern soll, so dass sie genau unter den icons ist.

Du kannst einem Element, das span übergeordnet ist (z.B. a oder td), ein position: relative; geben und das span dann an diesem absolut ausrichten (pixelgenau, nicht mit Prozent).

In der Entwicklungsphase würde ich das Ganze übrigens ohne PHP machen; nicht, daß sich evtl. von dieser Seite mal unbemerkt ein Fehler einschleicht.

xm22 10.08.2006 09:01

Nur der Richtigkeit halber:

Javascript hat nix mit Java an sich zu tun :)

P@trick 10.08.2006 13:03

Ich hab grad nochmal nachgeschaut und die Sternchen wahren garnicht bei mir im Code. Es sah also so aus:

Code:

<style type="text/css">
a span {
display: none;
}
       
a:hover span {
display: block;
position: absolute;
left: 7%;
top: 28%;
}
</style>

Wie gesagt IE und FF können damit irgendwie nix anfangen.

Ich hab auch schonmal probiert für den Span ne Extra Zeile aufzumachen, aber dann wurde es in Opera angezeigt, als wäre es ein ganz normaler Link und es wurde nicht verdeckt.

heiko_rs 10.08.2006 14:21

Kannst Du mal einen kompletten Code posten, so wie er ausgegeben wird? (ungeparstes PHP hilft wenig.)

P@trick 10.08.2006 16:33

Das Problem ist, dass es sich hier um die Forensoftware MyBBoard handelt und ich halt nur den html Code und den CSS Style anpassen kann.

Der PHP Code bezieht sich halt auf die Links und auf die Beschreibung der Links (in den language Ordnern).


Alle Zeitangaben in WEZ +2. Es ist jetzt 20:03 Uhr.

Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2020, vBulletin Solutions, Inc.

© Dirk H. 2003 - 2020