Problem mit Referenzierung, help!

Hallo allerseits, ich kriegs einfach nicht hin :-(

Also: In einem linken Kasten gibts im Hintergrund ein Bild, im
Vordergrund kann optional Schrift sein:

<div class="ltextaufbild" style="background:url(../lbilder/
lbild01.jpg) name='pic1'
no-repeat;color:white;">Rhabarber</div>

Im rechten Kasten eine Thumbnailgalerie, die Bilder sind fortlaufend
numeriert, funktioniert auch:

<div id="rkasten">
<H3>Bildergalerie</H3>
<div style="width:100%; height:200px; overflow:auto; border:0;">
<script language="javascript">
var numofimages = 10
for (X=1;X<numofimages; X++) {
document.write("<A HREF=javascript:document.pic1.src=../lbilder/
lbild0"+X+".JPG>")
document.write("<IMG SRC=../lbilder/thumbs/lbild0"+X+".JPG
width=75 height=68 vspace=10 hspace=10 border=0>")
document.write("</A>")}
</script>
</div>

Der Knackpunkt ist die Referenzierung. Die Zeile <A HREF="..."> soll
idealerweise das Hintergrundbild im linken Kasten wechseln ohne daß
die Seite neu aufgebaut wird - und genau das klappert nicht.

(Zur Not würde auch das wechseln des Vordergrunds mit einem Bild
reichen)

Ich hab im Netz gesucht, aber nix passendes gefunden und langsam gehen
mir die Ideen aus... Kann jemand helfen??

Thanx. Groetjes Arne (email ohne ng-)

On 3 Mai, 14:02, Arne <ng-a... (AT) goerndt (DOT) de> wrote:

Hallo allerseits, ich kriegs einfach nicht hin :-(

Tja da fällt mir einiges an Merkwürdigkeiten auf...

div class="ltextaufbild" style="background:url(../lbilder/
lbild01.jpg) name='pic1'
^^^^^^^^^^^^^^
no-repeat;color:white;">Rhabarber</div

Ein Style-Attribut "name" für ein Hintergrundbild? Gibt's nicht...
Auch ein HTML-Attribut "name" steht in div-Tags nicht zur Verfügung,
das gibt es nur in Formularen und für Bilder.

Es könnte z.B. so aussehen:
<div id="pic1" style="background:url(...)">

document.write("<A HREF=javascript:document.pic1.src=../lbilder/

^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
Zum einen sollte hier javascript klein geschrieben werden.

Und dann natürlich:
document.getElementById("pic1").style.backgroundIm age="url(xyz.jpg)"

Ob die Referenzierung über das a-Tag glücklich ist, wage ich zu
bezweifeln. Ich würde das lieber z.B. mit einem div-Tag machen, und
dann das onclick-event nutzen.
<div onclick="javascript:document.getElementById('pic1' ).... usw>

(Zur Not würde auch das wechseln des Vordergrunds mit einem Bild
reichen)

Wenn Du "<img src="xyz.jpg" name="pic1">" machst, dann funktioniert
auch "document.pic1.src=anderesBild.jpg" wieder.

Viel Spaß weiterhin... tschüß Horst.

horst lorenz wrote:

On 3 Mai, 14:02, Arne <ng-a... (AT) goerndt (DOT) de> wrote:
document.write("<A HREF=javascript:document.pic1.src=../lbilder/

^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
Zum einen sollte hier javascript klein geschrieben werden.

Es sollte überhaupt nicht so geschrieben werden, das ist propriertärer
Ballast, der nur für ganz wenige Fälle sinnvoll ist. Dieser gehört
nicht dazu.

Und dann natürlich:
document.getElementById("pic1").style.backgroundIm age="url(xyz.jpg)"

Ob die Referenzierung über das a-Tag glücklich ist, wage ich zu
bezweifeln. Ich würde das lieber z.B. mit einem div-Tag machen, und
dann das onclick-event nutzen.
div onclick="javascript:document.getElementById('pic1' ).... usw

Und hier ist das "javascript:" ebenfalls völlig überflüssig bis falsch.
Syntaktisch ist es bestenfalls ein Label, welches von dem grössten nicht
standardkonform arbeitenden Browser interpretiert wird, ohne dass der es
im Normalfall wirklich benötigen würde; schlimmstenfalls ist es ein
Syntaxfehler.

Wenn Du "<img src="xyz.jpg" name="pic1">" machst, dann funktioniert
auch "document.pic1.src=anderesBild.jpg" wieder.

Und wenn da ein alt-Attribut ergänzt wird, ist es sogar gültiges und mit
höherer Wahrscheinlichkeit barrierefreies HTML.


PointedEars
--
Prototype.js was written by people who don't know javascript for people
who don't know javascript. People who don't know javascript are not the
best source of advice on designing systems that use javascript.
-- Richard Cornford, <f806at$ail$1$8300dec7 (AT) news (DOT) demon.co.uk>