mediengestalter.info
Datenschutzerklärung
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter
Aktuelles Datum und Uhrzeit: Sa 20.04.2024 13:32 Benutzername: Passwort: Auto-Login

Thema: [JavaScript] Beim klick das Bild eines Menüs ändern. Nur wie vom 09.03.2008


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Programmierung -> [JavaScript] Beim klick das Bild eines Menüs ändern. Nur wie
Autor Nachricht
bbcsb
Threadersteller

Dabei seit: 09.03.2008
Ort: -
Alter: -
Geschlecht: -
Verfasst So 09.03.2008 16:34
Titel

[JavaScript] Beim klick das Bild eines Menüs ändern. Nur wie

 Antworten mit Zitat Zum Seitenanfang
Hallo,

ich bin grad dabei mir ein einfaches Menü für eine Webseite auf Basis von JavaScript zu schreiben. Bisher bin ich, mit meiner leicht begrenzten Java-Erfahrung, soweit gekommen:

Head-Tag:
Code:
 <script language="javascript" type="text/javascript">
function swap( span ) {
         displayType = ( document.getElementById( span ).style.display == 'none' ) ? 'block' : 'none';
         document.getElementById( span ).style.display = displayType;
      }
      </SCRIPT>


Da wo das Menü erscheint:
Code:

<A
                                onclick="swap('details'); return false;"
                                >
<img src="images/userpics/user_details_zu.jpg" width="137" height="17" border="0"></a><br>
                 <SPAN id=details s
                                style="DISPLAY: true"><b>Username</b><br>
                    ID: <br>
                    Status: <br>....


Soweit funktioniert das auch ganz gut. Einziger Hacken: Ich möchte, dass anstatt der user_details_zu.jpg beim klicken (öffnen) das Menüs eine anderes Bild angezeigt wird und vor allem auch angezeigt bleibt bist der Link erneut angeklickt wird.

Für jede Hilfe bin ich sehr Dankbar Lächel

Zuletzt bearbeitet von bbcsb am So 09.03.2008 16:35, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
itac

Dabei seit: 15.04.2004
Ort: -
Alter: 48
Geschlecht: -
Verfasst Mo 10.03.2008 17:10
Titel

Antworten mit Zitat Zum Seitenanfang
Hallo,

Zitat:
Soweit funktioniert das auch ganz gut. Einziger Hacken: Ich möchte, dass anstatt der user_details_zu.jpg beim klicken (öffnen) das Menüs eine anderes Bild angezeigt wird


dann tausche das img aus: document.bildID.src="anderesbild.jpg"; (oder mit getElementById)


Zitat:
auch angezeigt bleibt bist der Link erneut angeklickt wird.


dann die Swap-Funktion entsprechend erweitern.

Code:

function swap( span,bildID,tauschbild ) {
         displayType = ( document.getElementById( span ).style.display == 'none' ) ? 'block' : 'none';
         document.getElementById( span ).style.display = displayType;

         document.getElementById(bildID).src=displayType +tauschbild;//
        // 'blockuser.jpg' oder 'noneuser.jpg'
      }
---
onclick="swap('details','bildid','user.jpg'); return false;"



(ungetestet, nur prinzip)

salü
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Anzeige
Anzeige
Spurlos

Dabei seit: 29.10.2005
Ort: -
Alter: 41
Geschlecht: Männlich
Verfasst Mo 10.03.2008 18:08
Titel

Antworten mit Zitat Zum Seitenanfang
muss es javascript sein?
warum nich mit css?
  View user's profile Private Nachricht senden
bbcsb
Threadersteller

Dabei seit: 09.03.2008
Ort: -
Alter: -
Geschlecht: -
Verfasst Mo 10.03.2008 18:59
Titel

Antworten mit Zitat Zum Seitenanfang
Spurlos hat geschrieben:
muss es javascript sein?
warum nich mit css?


Nein, muss es nicht... Habe vorher auch eine css version probiert, damit bin ich aber leider gar nicht klar gekommen.

Danke itac, werds gleich mal ausprobieren und gegebenfalls berichten Lächel
  View user's profile Private Nachricht senden
Spurlos

Dabei seit: 29.10.2005
Ort: -
Alter: 41
Geschlecht: Männlich
Verfasst Mo 10.03.2008 21:57
Titel

Antworten mit Zitat Zum Seitenanfang
an was hing es denn?
  View user's profile Private Nachricht senden
itac

Dabei seit: 15.04.2004
Ort: -
Alter: 48
Geschlecht: -
Verfasst Di 11.03.2008 10:09
Titel

Antworten mit Zitat Zum Seitenanfang
moin,

eine css-Lösung würde mich in diesem Fall mal interessieren. Soweit ich weiß kann man mit css nur over/out machen und nicht klick=Zustand1; klick=Zustand2 (es sei man läd ne neue Seite)?.

salü
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
bbcsb
Threadersteller

Dabei seit: 09.03.2008
Ort: -
Alter: -
Geschlecht: -
Verfasst Di 11.03.2008 16:01
Titel

Antworten mit Zitat Zum Seitenanfang
Spurlos hat geschrieben:
an was hing es denn?


An meinen mangelnden CSS Kenntnissen... habe irgendwann mal aufgehört Html und co. zu lernen und da gabs css. noch net in der Form wie heute... ^^ Würde mich aber auch gern über eine css-lösung freuen, da ich ebenfalls nur die over/out variante kenne Lächel
  View user's profile Private Nachricht senden
misprintedtype

Dabei seit: 08.08.2006
Ort: -
Alter: -
Geschlecht: Weiblich
Verfasst Di 11.03.2008 16:13
Titel

Antworten mit Zitat Zum Seitenanfang
ich hab vor eeeewigkeiten mal solch eine kleine abfrage geschrieben. habs auch nicht mehr genau aufm schirm...

im endeffekt haste ne var. bei onClick ändert sich der wert der var (in bild2. z.B.), beim nächsten click auf bild3 usw...
später lieste die dann aus, wenn die navi geladen wird... und gibst $var."jpg" als namen für das bild an...

oh man, ich hoffe, ich hab mich halbwegs verständlich ausgedrückt... bin heut ziemlich durch... sry... * Ich muß mich mal kurz übergeben... *
  View user's profile Private Nachricht senden
 
Ähnliche Themen bei onlick bild ändern und bei nächstem klick wieder zurück
Design von Spry-Menüs ändern
[JavaScript] 2 Dropdown Menüs
Suche Buch, um JavaScript zu lernen (speziell Menüs)
Layout per Klick ändern
CSS - Hover / Link / Bild - Bild verschwindet nach Klick
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.

Mediengestalter.info ist ein Projekt von Webformatik :: Forensoftware: phpBB