mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Sa 03.12.2016 21:00 Benutzername: Passwort: Auto-Login

Thema: per JS extern m. CSS def. BG-bilder ändern vom 04.04.2005


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Programmierung -> per JS extern m. CSS def. BG-bilder ändern
Autor Nachricht
Ezah
Threadersteller

Dabei seit: 16.12.2004
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst Mo 04.04.2005 21:21
Titel

per JS extern m. CSS def. BG-bilder ändern

Antworten mit Zitat Zum Seitenanfang

Guten Abend, ich hab ein relativ exotisches Problem, zu dem ich nirgends etwas gefunden habe.

Situation:
Ich habe eine Internetseite mit einer grafischen Navigation bei der sich zusätzlich zu dem Mouseover des Buttons beliebig viele weitere Grafiken in DIVs an anderen Stellen ändern können (je nachdem wie viele man im JavaScript einbaut) gestaltet. Nun will ich die Seite barrierefrei mit XHTML 1.1 und externer CSS Datei und 100%iger Trennung von Design und Content nachbauen. JavaScript-Links sind da natürlich nicht drin. Mouseover kriegt man über die Link-Pseudoformate und Visability-Optionen problemlos hin, aber es ich habe keine Ahnung wie ich es auf die Reihe kriegen könnte, dass sich bei einem Mouseover über nem Link eine Grafik in einem anderen DIV ändert (1e würde ja schon reichen... )

Lösungsversuche:
Ich habe bereits versucht, das Script so abzuändern, dass es (im Style referenzierte) Hintergrundgrafiken ändert und nicht mehr die Bilder selbst. Da ich aber JavaScript mangels Kenntnissen nur durch Nachdenken und Rekombination vorhandener Elemente verändern kann, bin ich daran schnell gescheitert.

Die ganze Sache müsste dann so aussehen:

Code (reduziert):

Code:
<div id="link"><a class="molink" href="linkziel.html"><span class="molink2">LINK</span></a></div>
<div id="mo"></div>

Style (reduziert):

Code:
#link {}
#mo {}
a.molink {background-image:01.png;}
a.molink:hover {background-image:02.png;}
.molink2 {visibility:hidden;}

JavaScript:
kA ;) <= Problem...
es müsste doch irgendwie möglich sein, dass man per JS erfassen kann, wann man mit der Mouse über dem Link ist und dann in den CSS Angaben die Hintergrund-Angabe von #mo ändert.

Lassen sich mit JS überhaupt CSS-Angaben verändern?
Gibt es eventuelle eine Möglichkeit standardkonform eine dritte Grafik bei einem Linkhover zu ändern?
Geht es prinzipiell eine Grafik an einer anderen Stelle des Bildschirms zu ändern bei Textlinkmouseovern?
...

Bin dankbar um jedes Feedback. :)

Grüße,
Haze


Zuletzt bearbeitet von shakadi am Di 05.04.2005 07:11, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
beeviZ

Dabei seit: 30.09.2002
Ort: Dortmund
Alter: 23
Geschlecht: Männlich
Verfasst Mo 04.04.2005 23:24
Titel

Antworten mit Zitat Zum Seitenanfang

Code:
<a onmouseover="document.getElementById('mo').style.background = 'url(neuesbild.gif)';">link</a>
KÖNNTE/SOLLTE funktionieren. Getestet hab ichs nich, wär aber nur logisch

Zuletzt bearbeitet von shakadi am Di 05.04.2005 07:11, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Anzeige
Anzeige
Ezah
Threadersteller

Dabei seit: 16.12.2004
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst Di 05.04.2005 03:03
Titel

Vielen Dank!

Antworten mit Zitat Zum Seitenanfang

funktioniert einwandfrei, hab mir noch eine entsprechende onmouseout funktion geschrieben und die JS datei ausgelagert...
klasse... *handschüttel* vielen dank für die hilfe, dachte nicht, dass die lösung so simpel sein kann... das ersetzt ein x-zeilen monster JS und is eleganter :))
  View user's profile Private Nachricht senden
oki

Dabei seit: 04.04.2005
Ort: Oberhausen
Alter: 33
Geschlecht: Männlich
Verfasst Di 05.04.2005 08:45
Titel

Antworten mit Zitat Zum Seitenanfang

ich frage jetzt mal nicht, warum man sowas machen will
sternchen nichtfrag sternchen *zwinker*
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
 
Ähnliche Themen CSS extern verlinken
Diashow mit Flash erstellen Bilder extern pflegbar
[CSS] print.css soll Lightbox-Bilder drucken
CSS - Linkanzeige ändern
eingescannte Bilder ändern/bearbeiten
JavaScript - CSS - Klasse ändern
Neues Thema eröffnen   Neue Antwort erstellen
MGi Foren-Übersicht -> Programmierung


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.