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

Thema: Hoover durch background-position

  1. #1
    Meister(in)
    Registriert seit
    27.06.2008
    Ort
    Frankfurt am Main
    Alter
    27
    Beiträge
    485
    Danke
    3
    Bekam 0 mal "Danke" in 0 Postings

    Standard Hoover durch background-position

    Hallo,

    ich habe vor, folgende Hintergrundgrafik durch background-postion so zu verschieben, dass sich zwei verschiedene Versionen ergeben!

    facebook_index.png

    In diesem Falle ist die Grafik 290px lang und 332 Pixel hoch. Als Einzelgrafik hätte sie den Wert 290px*166px.
    Der obere Teil soll immer angezeigt werden und die blaue Facebook schrift beim darüberfahren.
    Irgendwo ist bei mir im CSS bzw. im HTML ein Fehler?!?!

    MFG

    HTML-Code:
    <a href=""><img class="facebookindex" src="img/facebook_index.png" /></a>
                             <p>
                            Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
                            </p>
    CSS

    Code:
    img.facebookindex a {
        background: url(../img/facebook_index.png) no-repeat;
        background-position: 0 0;
        width: 290px;
        height: 166px;
        }
        
    img.facebookindex a:hover {
        background-position: 290px -166px;
        width: 290px;
        height: 166px;
        }
    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: Hoover durch background-position

    du bindest das gleiche bild als img ein, was du als BG hast...
    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
    König(in)
    Registriert seit
    07.02.2009
    Ort
    Leipzig
    Beiträge
    1.391
    Danke
    2
    Bekam 21 mal "Danke" in 20 Postings

    Standard AW: Hoover durch background-position

    Und ein img-Element hat kein Kind-Element, so wie Du es hier definierst:
    Code:
    img.facebookindex a {

  4. #4
    Kaiser(in)
    Registriert seit
    24.04.2006
    Ort
    Ludwigshafen
    Beiträge
    2.720
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Hoover durch background-position


  5. #5
    Meister(in)
    Themenstarter

    Registriert seit
    27.06.2008
    Ort
    Frankfurt am Main
    Alter
    27
    Beiträge
    485
    Danke
    3
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Hoover durch background-position

    Danke schonmal für eure Tips!
    Ich verstehe das mit der zweiten class nicht ganz. Hier mein Ansatz.

    Code:
    img.facebookindex {
        width: 290px;
        height: 166px;
        display: block;
        margin: 0 auto;
        }
    
    img.facebookindex  {
        background: url(../img/facebook_index.png) no-repeat;
        }
        
    img.facebookindex:hover {
        background-position: 0 -166px;
        }
    HTML

    HTML-Code:
    <a href="#" class="facebookindex"></a>

  6. #6
    Unregistriert
    Gast

    Standard AW: Hoover durch background-position

    Mensch Billbos, du bist noch nicht mal in der Lage, einen CSS-Code von A nach B zu kopieren und die Namen anzupassen! Wenn du dabei schon Schwierigkeiten hast, dann verwende die gleichen Namen wie bei dem Link von Sejuma.

  7. #7
    König(in)
    Registriert seit
    07.02.2009
    Ort
    Leipzig
    Beiträge
    1.391
    Danke
    2
    Bekam 21 mal "Danke" in 20 Postings

    Standard AW: Hoover durch background-position

    Wenn Du das "img." im CSS weglässt, sollte es klappen.

  8. #8
    Unregistriert
    Gast

    Standard AW: Hoover durch background-position

    Zitat Zitat von threadi Beitrag anzeigen
    Wenn Du das "img." im CSS weglässt, sollte es klappen.
    Auch das wird nicht reichen.

  9. #9
    Meister(in)
    Themenstarter

    Registriert seit
    27.06.2008
    Ort
    Frankfurt am Main
    Alter
    27
    Beiträge
    485
    Danke
    3
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Hoover durch background-position

    leider klappt es beim weglassen des .img auch nicht! Ich habe jetzt zwar den Freiraum für das Bild aber es für nicht angezeigt!

    Bildschirmfoto 2011-08-06 um 12.04.08.png

  10. #10
    Unregistriert
    Gast

    Standard AW: Hoover durch background-position

    Du hast also jetzt:
    Code:
    facebookindex {
        width: 290px;
        height: 166px;
        display: block;
        margin: 0 auto;
        }
    
    facebookindex  {
        background: url(../img/facebook_index.png) no-repeat;
        }
        
    facebookindex:hover {
        background-position: 0 -166px;
        }
    Bei sejuma steht
    Code:
    .foto-link
     {
     width: 290px;
     height: 190px;
     display: block;
     margin: 0 auto;
     }
    
     .foto1
     {
     background: url(tor.jpg) no-repeat;
     }
    
     .foto-link:hover
     {
     background-position: 0 -190px;
     }
    Bei dir steht
    Code:
    <a href="#" class="facebookindex"></a>
    Bei sejuma
    Code:
    <a href="#" class="foto-link foto1"></a>
    Da fällt dir wirklich nichts auf?

    Da das ja nicht der erste Thread von dir ist, in dem du eine gewisse Form von Begriffstutzigkeit an den Tag legst, solltest du dir wirklich mal Gedanken darüber machen, ob du dir nicht ein anderes Hobby suchst!

Ähnliche Themen

  1. Pop-Up durch Mausklick bei aktueller Position
    Von Rosegones im Forum PHP Forum - Apache - CGI - Perl - JavaScript und Co.
    Antworten: 3
    Letzter Beitrag: 19.02.2010, 16:52
  2. Grafik soll bei Text-Hoover geändert werden (16x!)
    Von CHIEFmaster im Forum HTML & CSS Forum
    Antworten: 4
    Letzter Beitrag: 03.04.2007, 03:06
  3. Hoover/Mouseover Effekt
    Von im Forum HTML & CSS Forum
    Antworten: 3
    Letzter Beitrag: 12.03.2007, 09:15
  4. "Weiter" nur durch Button nicht durch "Enter&
    Von OJMD im Forum PHP Forum - Apache - CGI - Perl - JavaScript und Co.
    Antworten: 1
    Letzter Beitrag: 27.02.2007, 17:16
  5. 2 Attribute in CSS background-position: ?
    Von c25xe im Forum HTML & CSS Forum
    Antworten: 4
    Letzter Beitrag: 27.04.2005, 10:02

Stichworte

Berechtigungen

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