Seite 1 von 2 12 LetzteLetzte
Ergebnis 1 bis 10 von 12

Thema: Image Swap mit div / span

  1. #1
    Unregistriert
    Gast

    Standard Image Swap mit div / span

    Hallo,
    ich möchte das bei einem mouseover sich ein bild auf der webseite jedesmal ändert (an der selben position).
    Also zB man hat eine Liste an Wörtern mit Tieren, und je nachdem über welches man fährt ändert sich rechts an der webseite das Bild an der selben position.

    OK, mit HTML habe ich das alles schonmal hinbekommen, aber jetzt wird es super kompliziert. Auf der Seite wo ich das verwenden möchte kann man kein css normal verwenden, auch kein HTML mouseover.

    Mouseover zB sieht so aus: (geht auch nur so)

    <ul class="multi_select"><li class="selector">
    <a rel="nofollow" href="#" target="_blank">
    <span class="ms-int" style="width:186px;height:276px;background-image:url(pic01a.gif);border:0;margin:0;padding:0; ">

    <span class="button" style="width:186px;height:276px;background-image:url(pic01b.gif);border:0;margin:0;padding:0; "></span>
    </span>
    </a></li></ul>


    Und ich habe keine Ahnung warum das so wie oben beschrieben funktioniert... ich kenne die ganzen span class dinge nicht, ich kenn nur das standart css oder html mouseovers...

    Weiß jemand wie auf dem selben Prinzip wie oben so ein image swap funktionieren könnte? Wo sich dann wie ganz oben beschrieben das Bild an einer Position immer austauscht gegen zb "pic01c.gif" "pic01d.gif" "pic01d.gif" etc.?

    Ich weiß die Infos sind nicht gerade viel, vielleicht hat ja wer eine idee was klappen könnte? danke
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!

  2. #2
    Forum Guru Avatar von synaptic
    Registriert seit
    20.06.2007
    Ort
    Butzbach-Wiesental
    Beiträge
    10.901
    Danke
    45
    Bekam 48 mal "Danke" in 46 Postings
    Blog-Einträge
    1

    Standard AW: Image Swap mit div / span

    bahnhof berlin...

    also sowas geht über ein bild mit zwei zuständen (mouseover und mouseout in einer datei) und dann css-background-position ändern

    bei dem was du da oben hast wird beim hover der eine teil ausgeblendet und der andere ein, ohne hover isses umgekehrt

    und dann würde noch javascript ne gängige methode darstellen.

    nur wie soll dir jemand helfen wenn man css nich normal (was heisst das in deinen ohren??) eingebunden werden kann
    KEIN support via pn, email, messenger oder falsch geposteten threads
    Futter für deine Schnuffelzwerge gibts bei den Schnuffelzwergen TOP Qualität, also klicken und kaufen

  3. #3
    HTML Newbie
    Registriert seit
    02.06.2012
    Beiträge
    4
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Image Swap mit div / span

    so wie hier: http://www.web-toolbox.net/webtoolbo...vorschau03.htm Aber geht da sirgendwie nur mit < div & < span?
    Geändert von ot4ku (02.06.2012 um 20:13 Uhr)

  4. #4
    Forum Guru Avatar von synaptic
    Registriert seit
    20.06.2007
    Ort
    Butzbach-Wiesental
    Beiträge
    10.901
    Danke
    45
    Bekam 48 mal "Danke" in 46 Postings
    Blog-Einträge
    1

    Standard AW: Image Swap mit div / span

    das is dort mit javascript gelöst und nicht mit css
    stell hier mal dein codegerüst ein, dann setz ich mich heut abend oder morgen früh hin und bau dir dein javascript dafür
    KEIN support via pn, email, messenger oder falsch geposteten threads
    Futter für deine Schnuffelzwerge gibts bei den Schnuffelzwergen TOP Qualität, also klicken und kaufen

  5. #5
    HTML Newbie
    Registriert seit
    02.06.2012
    Beiträge
    4
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Image Swap mit div / span

    Danke... kann man das irgendwie ohne java script machen? weil das wird nicht supportet auf der seite... geht es vielleicht mit diesen < div & < span befhelen? ich weiß nicht wieso justin.tv das so unglaublich kompliziert macht :/ kein javascript, keine externe css, meisten css dinge funktionieren auch nicht... total doof. Aber Mouseove rgeht eben wie oben beschrieben mit < span und < div dingen...
    Geändert von ot4ku (02.06.2012 um 20:12 Uhr)

  6. #6
    Samurai Avatar von Bleistift
    Registriert seit
    20.03.2012
    Alter
    21
    Beiträge
    235
    Danke
    0
    Bekam 4 mal "Danke" in 4 Postings

    Standard AW: Image Swap mit div / span

    Eigentlich geht es nur mit JS ^^
    Die Spans bekommen nämlich immer andere Positionen, da man diese nur mit top,left etc. vom Word aus steuern kann.
    Heißt das Bild unter dem ersten Bild ist dann woanders oder wäre kleiner als das obere ^^

    Ansonsten würde man spans folgender Maßen realisieren:
    Code:
    #element {
    deine anweisungen;
    }
    
    #element span {
    display: none;
    }
    
    #element:hover span {
    display: block;
    wo, wie, etc.;
    }
    HTML
    HTML-Code:
    <div id="element"><span>Span</span></div>


  7. #7
    Bandit
    Gast

    Standard AW: Image Swap mit div / span

    Zitat Zitat von Bleistift Beitrag anzeigen
    Eigentlich geht es nur mit JS ^^
    Quatsch! Siehe z.B. http://www.cssplay.co.uk/menu/gallery.html

  8. #8
    Forum Guru Avatar von synaptic
    Registriert seit
    20.06.2007
    Ort
    Butzbach-Wiesental
    Beiträge
    10.901
    Danke
    45
    Bekam 48 mal "Danke" in 46 Postings
    Blog-Einträge
    1

    Standard AW: Image Swap mit div / span

    da ja javascript und frames gestrippt werden bei justin... lass dir des teil in flash basteln.. kommt viel (achtung jetzt das wortspiel)
    FLASHIGER...^^
    KEIN support via pn, email, messenger oder falsch geposteten threads
    Futter für deine Schnuffelzwerge gibts bei den Schnuffelzwergen TOP Qualität, also klicken und kaufen

  9. #9
    HTML Newbie
    Registriert seit
    02.06.2012
    Beiträge
    4
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Image Swap mit div / span

    Zitat Zitat von Bleistift Beitrag anzeigen
    Eigentlich geht es nur mit JS ^^ Die Spans bekommen nämlich immer andere Positionen, da man diese nur mit top,left etc. vom Word aus steuern kann. Heißt das Bild unter dem ersten Bild ist dann woanders oder wäre kleiner als das obere ^^ Ansonsten würde man spans folgender Maßen realisieren:
    Code:
    #element { deine anweisungen; }  #element span { display: none; }  #element:hover span { display: block; wo, wie, etc.; }
    HTML
    HTML-Code:
    Span
    Kannst du mir DAS beispielt mit ner grafik machen? also grafik1 wird ausgetauscht mit grafik 2 bei mousove von nem text bei anderen text mit grafik3 bzw. wieder anderem wort, grafik4, geht das? aber erstmal teste ich dein erstes beispiel. Ach und wegen Flash... ich hab mal wieder keine Ahung, hab aber swish damit gehen einige sachen einfacher, aber glaub da scheiter ich auch dran. Also wenns anders geht wäre super.

  10. #10
    HTML Newbie
    Registriert seit
    02.06.2012
    Beiträge
    4
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Image Swap mit div / span

    Ich denke da sklappt einfach garnicht.... wenn ich den code in html datei schreibe und uploade sieht da sso aus: http://ot4ku.net/twitchtv/description-ot4net-v6.html aber auf justin.tv siehts dannr ichtig aus, ich versteh nicht was die für eins eltsames system verwenden

Ähnliche Themen

  1. Problem im IE6 mit span und ein-/ausblenden
    Von eky79 im Forum HTML & CSS Forum
    Antworten: 3
    Letzter Beitrag: 28.05.2009, 16:09
  2. image hoster | image-uploads.de v.3
    Von Hubi im Forum Link Tipps
    Antworten: 10
    Letzter Beitrag: 10.06.2008, 16:23
  3. Welche Container benutzen(div,span,tabelle?!)
    Von Olaf im Forum HTML & CSS Forum
    Antworten: 12
    Letzter Beitrag: 24.04.2007, 18:37
  4. span/div!
    Von Rasantokelo im Forum HTML & CSS Forum
    Antworten: 11
    Letzter Beitrag: 22.04.2007, 19:58
  5. linux - swap
    Von Webby im Forum Computer - Internet Forum
    Antworten: 1
    Letzter Beitrag: 16.06.2005, 12:27

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •