Ergebnis 1 bis 2 von 2

Thema: Mit Javascript CSS Background-Image ändern

  1. #1
    HTML Newbie
    Registriert seit
    25.11.2018
    Beiträge
    1
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard Mit Javascript CSS Background-Image ändern

    Hallo Freunde,

    wie im Titel beschrieben, möchte ich gern mit Javascript ein Hintergrundbild ändern.
    Sobald der Benutzer über einen Link fährt, soll sich dazu ein Bild aufzeigen und wenn
    er diesen wieder verlässt, soll es nicht mehr angezeigt werden.

    Es gehen praktisch alle CSS Befehle bis auf das Background Image.
    Wenn ich diesen Befehl normal in CSS ausführen lassen, geht es.
    Pfad ist also auch korrekt.
    Hat da jemand eine Idee?

    Code:
         
    HTML:
    <a id="ab" href="mailto:email@.com?subject=Kontakt-Homepage">E-Mail</a>
            
     <script>              
      $(document).ready(function(){
                      $("#ab").mouseout(function(){
                        $(".intro_bilder").css("background-image", "url('../bilder/ma/kb.jpg')");
                        $(".intro_bilder").css("background-size", "cover");
                      });
    
                    $("#ab").mouseout(function(){
                         $(".intro_bilder").css("display", "none");
                      });
      });
    </script>
    Jemand eine Idee, wieso nur Background Image nicht geht?

    Danke

  2. #2
    Samurai
    Registriert seit
    23.01.2018
    Ort
    Minden
    Beiträge
    209
    Danke
    0
    Bekam 29 mal "Danke" in 29 Postings

    Standard AW: Mit Javascript CSS Background-Image ändern

    Ich gehe mal davon aus das der Container kein Inhalt hat mit den Bild ? Deswegen wird höhe und breite wahrscheinlich auf 0 Pixel stehen.
    Versuch es mal so
    Code:
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <a id="ab" href="mailto:email@.com?subject=Kontakt-Homepage">E-Mail</a>
    <div class="intro_bilder"></div>     
     <script>       
      $(document).ready(function(){
         $("#ab").hover(function(){
           $(".intro_bilder").css({
    'background-image': 'url(http://sebastian1012.bplaced.net/bilder/homer.jpeg)',
          'background-size':'contain',
          'height':'200px',
          'width':'200px',
          'display':'block'
           }).mouseout(function(){
                $(".intro_bilder").css('display','none');
           })
         });
      }); 
     
    </script>
    Den rest wirst du dann hinbekommen
    Mein soforthilfe Forum und Chat

Ähnliche Themen

  1. CSS Menü Background Image
    Von bodyXY im Forum HTML & CSS Forum
    Antworten: 2
    Letzter Beitrag: 12.04.2017, 08:36
  2. background-image
    Von Hacky im Forum HTML & CSS Forum
    Antworten: 0
    Letzter Beitrag: 29.01.2017, 11:37
  3. background-image im FF
    Von Kroan im Forum HTML & CSS Forum
    Antworten: 3
    Letzter Beitrag: 26.10.2009, 18:10
  4. background-image
    Von Unregistriert im Forum HTML & CSS Forum
    Antworten: 4
    Letzter Beitrag: 19.10.2009, 07:44
  5. background-image für Layer
    Von JungerDesigner im Forum HTML & CSS Forum
    Antworten: 17
    Letzter Beitrag: 25.09.2008, 00:56

Stichworte

Berechtigungen

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