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

Thema: Hover Problem bei der Navigation

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

    Standard Hover Problem bei der Navigation

    Guten Mittag

    Ich bin dabei für Informatik eine Homepage zu erstellen bin aber noch ein Blutiger Anfänger

    Ich stehe Momentan vor einem kleinen Schönheitsfehler bei der Navigation, welchen ich nicht weg bekomme..


    So soll es aussehen:




    Also die ganze Zeile des Menüpunktes über den man "hovert" soll:
    bg-color: white und text-color: black sein.


    So sieht es allerdings nur aus, wenn man über die Schrift/Link eines Menüpunktes (z.B."Home") hovert
    __________________________________________________ ______________________________________

    So sieht es dann aus wenn mann nur über die Zeile und nicht über die Schrift/Link eines Menüpunktes (z.B. "Home") "hovert"




    Wie schaffe ich das?


    Im Prinzip soll:
    Wenn man über li hovert, auch .Hint:hover in Kraft treten.

    Hier der relevante Code:


    <style type="text/css">
    h1 {font-size: 50px;text-align: center; font-face: Agency FB; }
    h2 {color: white; font-size: 40px;text-align: center; }
    h3 {color: white; font-size: 35px;text-align: center; }
    P {color: white; }
    Body, a {background-image:url(#);[/url] background-repeat:no-repeat; background-position: center; font: normal 120.01% Agency FB, sans-serif; color: white; background-color: black; }
    table {color: white; margin-left:70px; }
    ul#Navigation {margin: 0; padding: 0; }
    ul#Navigation li {list-style: none; margin: 0; padding: 0;font-size: 22px; }
    .table_music {margin-left: auto; margin-right: auto; }
    .image {transition: transform 1s; }
    .image:hover {transform: scale(1.5, 1.5); }
    .text {transition: transform 1s; }
    .text:hover {transform: scale(1.5, 1.5); }
    .Hint {background-color: black; color: white }
    .Hint:hover {background-color: white; color: black }
    li:hover {background-color: white }
    </style>

    __________________________________________________ ____

    <!-- Navigation -->


    <table width="8%" border="1" cellpadding="5" cellspacing="1">
    <tr bgcolor="black">
    <td align="center" style="text-align:center;"> <ul id="Navigation">
    <font size="+3,5">Menü</font>
    <li><a href="#"><span class="Hint"; > Home </span> </a></li>
    <li><a href="#"> <span class="Hint"; >Infos</span> </a></li>
    <li><a href="#"> <span class="Hint"; >Team</span> </a></li>
    <li><a href="G#"> <span class="Hint"; >CreepyPastas</span> </a></li>
    </ul></td>
    </tr>
    </table>


    <!-- end of Navigation -->




    Bei Fragen einfach melden!


    Danke im Vorraus und Liebe Grüße
    Nyrumi
    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
    König(in)
    Registriert seit
    13.06.2012
    Beiträge
    1.151
    Danke
    14
    Bekam 63 mal "Danke" in 61 Postings

    Standard AW: Hover Problem bei der Navigation

    Du vergibst nur eine Farbe:

    li:hover {background-color: white }
    Gegen Mods kommt man nicht an, die haben immer Recht. Sind scheinbar nicht kritikfähig.

  3. #3
    HTML Newbie
    Themenstarter

    Registriert seit
    14.06.2015
    Beiträge
    6
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Hover Problem bei der Navigation

    Was genau meinst du damit? Ich habe ja li:hover {background-color: white} im style

  4. #4
    König(in)
    Registriert seit
    13.06.2012
    Beiträge
    1.151
    Danke
    14
    Bekam 63 mal "Danke" in 61 Postings

    Standard AW: Hover Problem bei der Navigation

    Link zur Seite wäre sinnvoll.

    du gibst a eine schwarze Hintergrundfarbe, dann ist die auch schwarz, wie gewollt.
    Gegen Mods kommt man nicht an, die haben immer Recht. Sind scheinbar nicht kritikfähig.

  5. #5
    HTML Newbie
    Themenstarter

    Registriert seit
    14.06.2015
    Beiträge
    6
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Hover Problem bei der Navigation

    https://www.dropbox.com/s/9a28yto4qj...Home.html?dl=0 Ich habe die Home.html mal auf Dropbox hochgeladen.. Müsste ja mit z.B. phase5 zu öffnen sein, Hoffe es hilft bei dem Lösen des Problemes...
    Geändert von Nyrumi (14.06.2015 um 18:05 Uhr)

  6. #6
    König(in)
    Registriert seit
    13.06.2012
    Beiträge
    1.151
    Danke
    14
    Bekam 63 mal "Danke" in 61 Postings

    Standard AW: Hover Problem bei der Navigation

    Dein Problem sind einfach falsche Syntax in den CSS-Anweisungen. Validiere mal. Wenn du Phase5² nimmst, installier dir HTML-Tidy.

    Und sowas, naja...
    <body>
    </div>

    2x body und lass die Tabellen sein.
    Geändert von Gastl (14.06.2015 um 17:50 Uhr)
    Gegen Mods kommt man nicht an, die haben immer Recht. Sind scheinbar nicht kritikfähig.

  7. #7
    HTML Newbie
    Themenstarter

    Registriert seit
    14.06.2015
    Beiträge
    6
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Hover Problem bei der Navigation

    Ich danke dir zwar für den Hinweis aber der "Fehler"
    <body>
    </div>
    Ist nicht ausschlaggebend zu meinem Problem..
    welche Syntax in den CSS-Anweisungen sind denn falsch?

    und was genau meinst du mit " und lass die Tabellen sein."

  8. #8
    König(in)
    Registriert seit
    13.06.2012
    Beiträge
    1.151
    Danke
    14
    Bekam 63 mal "Danke" in 61 Postings

    Standard AW: Hover Problem bei der Navigation

    Es ist ganz einfach so, dass HTML und CSS Anweisungen einer bestimmten Syntax zu folgen haben. Das ist bei dir nicht der Fall.

    Das mit den
    <body>
    </div>

    ist zwar, wie du bemerkst nicht der Grund für dein Problem, aber exemplarisch für deinen Quellcode. Ich wiederhole mal, validiere deinen Quellcode. Dazu gibt es vom W3C eine Seite, bei der man das kostenlos machen kann.

    Was ich mit Tabelle weglassen meine? Man stellt zwar aus Höflichkeit keine Gegenfragen, aber was willst du denn mit den Tabellen erreichen? Du hast keine Daten die tabellarisch dargestellt werden müssen in deinem Quelltext drin. Somit ist eine oder mehrere Tabelle(n) fehl am Platze.
    Gegen Mods kommt man nicht an, die haben immer Recht. Sind scheinbar nicht kritikfähig.

  9. #9
    HTML Newbie
    Themenstarter

    Registriert seit
    14.06.2015
    Beiträge
    6
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Hover Problem bei der Navigation

    Ich habe eine Tabelle für die Navigation benutzt, da zu dem Zeitpunkt dies für mich am einfachsten war um sie so aussehen zu lassen wie sie nun aussieht.. Wie schon gesagt.. Ich bin noch ein Anfänger

  10. #10
    König(in)
    Registriert seit
    13.06.2012
    Beiträge
    1.151
    Danke
    14
    Bekam 63 mal "Danke" in 61 Postings

    Standard AW: Hover Problem bei der Navigation

    Sorry, man kann lernen
    Sollte es auch. Niemand ist perfekt, jeder lernt.

    Tipp: Sieh dir deine CSS-Anweisungen an. Einzelne Anweisungen enden mit einem Semikolon. Das ist dein Anzeigefehler. Die fehlen, glaube in 3 Zeilen.

    Wenn es für dich einfach ist von vornherein Fehler zu lernen und zu verinnerlichen, bist du auf einem falschen Weg. Lerne von Anfang an mit CSS zu positionieren und zu stylen. Mit Tabellen kann man das auch "noch" machen, aber HTML entwickelt sich weiter. So hast du z.B. etwas in deinem Quellcode drin, das es nicht mehr gibt, aber Browser das noch übersehen und auch interpretieren. Irgendwann ist damit aber Schluss und dann sieht deine Seite von heute auf morgen Sch.... aus. Dann ist das Geheul groß.

    So hast du z.B. drin: font-face
    W3C CSS sagt dazu: Die Eigenschaft font-face existiert nicht : Agency FB
    Gegen Mods kommt man nicht an, die haben immer Recht. Sind scheinbar nicht kritikfähig.

Ähnliche Themen

  1. Navigation mit Hover-Effekt
    Von Aikido im Forum HTML & CSS Forum
    Antworten: 3
    Letzter Beitrag: 14.10.2011, 12:23
  2. Antworten: 7
    Letzter Beitrag: 03.07.2009, 23:20
  3. CSS-Frage: Hover-Navigation
    Von im Forum HTML & CSS Forum
    Antworten: 5
    Letzter Beitrag: 15.08.2007, 22:25
  4. Navigation mit hover
    Von Andreas84 im Forum HTML & CSS Forum
    Antworten: 9
    Letzter Beitrag: 03.05.2007, 04:48
  5. Problem mit Hover
    Von Aeos im Forum HTML & CSS Forum
    Antworten: 1
    Letzter Beitrag: 09.12.2006, 10:30

Stichworte

Berechtigungen

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