ilch Forum » Ilch Clan 1.1 » Design und Templates » Dynamisches Design mit Rollover

Geschlossen
  1. #1
    User Pic
    Syncronix Mitglied
    Registriert seit
    21.10.2006
    Beiträge
    1.935
    Beitragswertungen
    0 Beitragspunkte
    Hallo, wie mach ich das wenn ich ein Design mache was Dynamisch sein soll mit Rollover Bilder im Menü?

    Codes dafür währen hilfreich! Und eine info wo die codes rein sollen natürlich auch ^^.

    Danke
    0 Mitglieder finden den Beitrag gut.
  2. #2
    User Pic
    no2 Mitglied
    Registriert seit
    18.02.2006
    Beiträge
    217
    Beitragswertungen
    0 Beitragspunkte
    CSS lernen. ^^

    Wir bei neXor.Gaming haben das ja auch dynamisch und mit rollover. Ich muss mal schauen wie wir das gemacht haben...

    EDIT: a:hover in der div class mit background-image - damit muss es klappen


    Zuletzt modifiziert von no2 am 03.01.2007 - 12:14:56
    0 Mitglieder finden den Beitrag gut.
  3. #3
    User Pic
    Syncronix Mitglied
    Registriert seit
    21.10.2006
    Beiträge
    1.935
    Beitragswertungen
    0 Beitragspunkte
    Danke, wo muss das genau hin?
    In die style.css?

    Könntest du mal eine style.css posten in der sowas drine ist?

    DANKE!


    MfG
    Lukas
    0 Mitglieder finden den Beitrag gut.
  4. #4
    User Pic
    no2 Mitglied
    Registriert seit
    18.02.2006
    Beiträge
    217
    Beitragswertungen
    0 Beitragspunkte
    Ich hab mal was gemacht:

    Das muss in die Style.css
    .lnav {
    width : 158px;
    float : left;
    overflow : hidden;
    color : #ffffff;
    background-image : url();
    }
    .lnav_head {
    width : 158px;
    height : 30px;
    float : none;
    color : #ffffff;
    background-image : url();
    }
    .leftnav_menupunkt {
    width : 158px;
    height : 21px;
    display : block;
    background-image : url();
    }
    .leftnav_menupunkt a {
    display: block;
    background-image: url();
    }
    .leftnav_menupunkt a:hover{
    display: block;
    background-image: url();
    }



    Das muss in die Index.htm

    <div class="lnav">
     	{_list_menunr1@
     		<div class="lnav_head">%1</div>
    	<div class="leftnav-menupunkt">%2</div>
    </div>



    Um das realisieren zu können müsstest du dich schon ein wenig in css auskennen.


    Zuletzt modifiziert von no2 am 03.01.2007 - 12:28:45
    0 Mitglieder finden den Beitrag gut.
  5. #5
    User Pic
    thbreidenbach Mitglied
    Registriert seit
    05.05.2006
    Beiträge
    348
    Beitragswertungen
    0 Beitragspunkte
    a:hover {
    display:block;
    ggfs. line-height: (Höhe des Bildes);
    background:#000000 url(Pfad zum Bild) no-repeat;
    color:#cc0000;
    }


    ungefähr so würde ich mir das vorstellen. In der Index.htm müssen hierfür ggfs die ul und li Elemente raus, damit das nicht kollidiert zwinker (Ganz unten, wo das Menü gezogen wird)

    Gruss Breiti
    -->leider kein "ilcher" mehr...
    externer Link
    0 Mitglieder finden den Beitrag gut.
  6. #6
    User Pic
    no2 Mitglied
    Registriert seit
    18.02.2006
    Beiträge
    217
    Beitragswertungen
    0 Beitragspunkte
    ZitatZitat geschrieben von thbreidenbach

    In der Index.htm müssen hierfür ggfs die ul und li Elemente raus, damit das nicht kollidiert zwinker (Ganz unten, wo das Menü gezogen wird)


    In der index.htm macht man doch normalerweise keine ul / li Elemente rein. Oder nich ?
    0 Mitglieder finden den Beitrag gut.
  7. #7
    User Pic
    thbreidenbach Mitglied
    Registriert seit
    05.05.2006
    Beiträge
    348
    Beitragswertungen
    0 Beitragspunkte
    Doch, ganz unten in der Index.htm werden die gezogen^^ Da wird eine ul mit li Elementen aufgemacht - die beisst sich (zumindest bei mir) mit dem Hover zwinker

    Mein neues Design auf rafx.de hab ich auch als DIV Design programmiert (nur mit variabler Breite lächeln )

    ...muss noch die Anpassung an IE machen die DTD ist falsch^^

    Gruss Breiti
    -->leider kein "ilcher" mehr...
    externer Link
    0 Mitglieder finden den Beitrag gut.
  8. #8
    User Pic
    Syncronix Mitglied
    Registriert seit
    21.10.2006
    Beiträge
    1.935
    Beitragswertungen
    0 Beitragspunkte
    Dankeschön
    0 Mitglieder finden den Beitrag gut.
  9. #9
    User Pic
    no2 Mitglied
    Registriert seit
    18.02.2006
    Beiträge
    217
    Beitragswertungen
    0 Beitragspunkte
    OJE Der neue IE und CSS lachen ich hasse es. Naja ich hab mein erstes tabellenloses design auch hinter mir und muss sagen das es jetzt echt gut klappt in KEINEM Browser gibt es jetzt noch Bugs.
    0 Mitglieder finden den Beitrag gut.
  10. #10
    User Pic
    thbreidenbach Mitglied
    Registriert seit
    05.05.2006
    Beiträge
    348
    Beitragswertungen
    0 Beitragspunkte
    Naja, sobald ich den Doctype drinne hab, sollte der IE 6 seinen A... aus dem Quirks Modus bewegen und die Page richtig darstellen lachen

    Aber da das Design im Moment nur anwählbar ist (ab User^^) sollen mir die IE6ler noch gestohlen bleiben zunge In allen anderen Browsern siehts geil aus lächeln
    Denke dass ich es mitte Januar On stelle, kannst ja mal reinschauen zwinker

    Gruss Breiti
    -->leider kein "ilcher" mehr...
    externer Link
    0 Mitglieder finden den Beitrag gut.
  11. #11
    User Pic
    no2 Mitglied
    Registriert seit
    18.02.2006
    Beiträge
    217
    Beitragswertungen
    0 Beitragspunkte
    werd ich machen.

    IE 6 ? gibts ja bald eh nich mehr.
    0 Mitglieder finden den Beitrag gut.
  12. #12
    User Pic
    thbreidenbach Mitglied
    Registriert seit
    05.05.2006
    Beiträge
    348
    Beitragswertungen
    0 Beitragspunkte
    leider kriegen wir heute noch 10% unserer Hits über den IE6.0 ... werde ihn nicht auslassen können :'(

    Gruss Breiti
    -->leider kein "ilcher" mehr...
    externer Link
    0 Mitglieder finden den Beitrag gut.
  13. #13
    User Pic
    no2 Mitglied
    Registriert seit
    18.02.2006
    Beiträge
    217
    Beitragswertungen
    0 Beitragspunkte
    naja gut diese "Minderheit" kann man getrost unterdrücken *gg*
    0 Mitglieder finden den Beitrag gut.
Geschlossen

Zurück zu Design und Templates

Optionen: Bei einer Antwort zu diesem Thema eine eMail erhalten