html-frage... (oder javascript?): rollover-buttons

Dieses Thema im Forum "Software" wurde erstellt von p.i.t., 5. Oktober 2004.

  1. p.i.t.

    p.i.t. Ural-Silber

    hi folks

    ich möchte in einer kleiner tabelle (1 spalte, 5 zeilen) eine navigation erstellen. 5 buttons untereinander. die zellen sind hell, die schrift dunkel. statt aber mit gifs zu arbeiten, die bei rollover ein swapimage hervorrufen, möcht ich das eigentlich gern mit reinem text machen. also: die textfarbe und vor allem auch die hintergrundfarbe der zelle verändert sich bei rollover...

    geht das? wenn ja wie? mit css? javascript?

    grund für meine frage: bei 3 dieser 5 buttons gehen beim drüberfahren auch noch popup-menus auf, die ja auch reinen text generieren. wenn ich also die hauptbuttons mit gifs lösen würde, sehen diese unter umständen (je nach browser oder plattform) völlig anders aus als die popup-textchen...

    ich hoffe ich hab mich verständlich ausgedrückt... hab bei selfhtml nichts gefunden...
     
  2. Chance

    Chance New Member

    .....ja, das funktioniert und zwar ganz einfach mit CSS.

    Wenn du mit Dreamweaver arbeiten solltest, kannst du bequem für einen Text ein CSS definieren und hier unter "Effekte" den Roll-Over einstellen(Farbe tec.).

    Mit Javascript würde es natürlich auhc gehen, wäre aber umständlich, Dreamweaver schreibt dir den code, den du brauchts und du kannst auch bequem im Quellcode nächträglich Veränderungen durchführen.

    Alternativ könntest du auch deine Buttons mt jpegs erstellen. Vorteil: diese sehen wesentlich besser als gifs aus(zB. Farbverläufe).

    Grüße Chance
     
  3. RaMa

    RaMa New Member

    so wie chance sagt und:

    css hui, js pfui :)
     
  4. p.i.t.

    p.i.t. Ural-Silber

    danke chance

    ich hab dreamweaver mx (aber nicht 2004) auf englisch. bei den css einstellungen unter "type" seh ich nix von effekten... ist das erst bei mx so?

    und: kann man dort auch die hintergrundfarbe der tabellenzelle ändern für den rollovereffekt? das wär mir fast wichtiger als nur die textfarbe...
     
  5. Chance

    Chance New Member

    ...noch was, du kannst unter Dreamweaver deinen neune CSS in einem eigenen Reiter bearbeiten, dort findest du alles, was du an Effekten(Farbe etc.) ändern kannst und kannst zu dem auch noch die Browserversion(3.x, 4.x) einstellen(denn nicht jeder Effekt wird von jedem unterstützt).
    Dies als Zusatzinfo!

    Grüße Chance
     
  6. p.i.t.

    p.i.t. Ural-Silber

    @RaMa
    ganz ohne js komm ich leider nicht aus, die popups sind ja auch so gemacht...
     
  7. p.i.t.

    p.i.t. Ural-Silber

    eben, aber dort finde ich nichts was auf Rollover hindeutet... sieht bei mir so aus (siehe attach)
     
  8. RaMa

    RaMa New Member

    war nur auf die navi bezogen, weiß schon manchmal gehts halt nicht anders. :)
     
  9. graphitto

    graphitto Wanderer

    Hallo p.i.t.,

    was du da vorhast, lässt sich sehr gut mit CSS2 realisieren. Wie es geht findest du hier:

    http://www.css-technik.de/details/85/8/Tutorials-CSS.htm

    Mit deiner DW-version wird das allerdings nichts. Die CSS-Unterstützug ist erst ab DW2004 halbwegs brauchbar. Aber in obigem Link ist ja der Code für die Navi mit Infobox enthalten.

    Hoffe geholfen zu haben. ;o)

    gruß
     
  10. p.i.t.

    p.i.t. Ural-Silber

    hallo graphito

    ich hab mir diese tutorials etwas angeschaut, vor allem den abschnitt "CSS-Menüs mit Rollover". Ich bin noch nicht ganz schlau geworden, weil da mit "floaters" gearbeitet wird, und die möchte ich möglichst vermeiden. aber insgesamt scheint das eine sehr nützliche seite zu sein.

    was dw mx 2004 betrifft, so hab ich mir jetzt die neuste version besorgt. ist wieder ziemlich anders als die alte, ich werde wohl wieder etwas zeit brauchen bis ich mich da umgewöhnt habe.

    drum hier nochmal die frage (ich hoffe ich nerve nicht):
    wo bei den css-einstellungen vom dreamweaver gebe ich ein, wie sich ein button (also rechteckige box, sagen wir 100 x 20 pixel gross, mit schrift drin) bei rollover verändern muss...? ich kanns einfach nicht finden... bin wahrscheinlich wirklich zu doof für so sachen ;(
     
  11. DieterBo

    DieterBo New Member

  12. caMi

    caMi New Member

    ...auch interessant, denn ohne Verständnis der Zusammenhänge wirds Flickschusterei:
    css

    ansonsten,denke ich, wenn Button
    Einfügen -> Grafik -> Rollover

    und/oder
    Modifizieren -> Seiteneigenschaften -> Verknüpfungen

    und im Fensterchen oben rechts:
    Design -> CSS-Stile (ev. erstellen) -> Selektor und bearbeiten

    *1000*
     
  13. p.i.t.

    p.i.t. Ural-Silber

    das wär ja jetzt aber wieder mit rollover-gifs, oder? von dem möcht ich ja eben gerade wegkommen...

    ich glaube mein problem ist, dass ich es nicht schaffe, ein KÄSTCHEN als button zu definieren, sondern immer nur die schrift darin. ich kann die schriftfarbe bei rollover ändern, aber ich weiss nicht, wie die hintergrundfarbe des kästchens gleichzeitig die farbe wechselt...

    hmm tricky das
     
  14. oli

    oli New Member

    füge mal die zeilen in den quellcode ein. da wo der head steht.

    <head>
    <meta http-equiv="content-type" content="text/html;charset=ISO-8859-1">
    <style type="text/css" media="screen"><!--
    a:hover { background-color: #818181; width: 100px; height: 20px }
    a { background-color: #4d4d4d; width: 100px; height: 20px; visibility: visible; display: block }
    --></style>
    </head>
     
  15. caMi

    caMi New Member

    jetzt ich verstehen!

    Also per Hand wurde schon erwähnt wie es geht.
    In MX: Tabelle erstellen, Text in Zelle schreiben, Link daraus erstellen, dann rechte Maustaste, CSS Stile, neu, dem neuen Stil einen Namen geben, es erscheint ein Dialogfenster, hier Hintergrund wählen.

    Nachtrag:
    ....hmmmm, Rollover kann ich da jetzt auch nicht mehr entdecken - füge es per "Handarbeit" ein, ist letztendlich weniger aufwendig!
     
  16. p.i.t.

    p.i.t. Ural-Silber

    tadaa, ich glaub ihr seid doch einfach doch alles helden!!!
    so sollte sogar ich affenhirn es schaffen! vielen dank...
     
  17. oli

    oli New Member

    könntest du noch sagen, wie du es jetzt gemacht hast. für die anderen user.

    bei solchen fragen verweise ich immer auf de.selfhtml.org
     
  18. p.i.t.

    p.i.t. Ural-Silber

    eigentlich genau wie du es beschrieben hast: mit dem css-style im head-tag. allerdings dachte ich immer, dass man ein externes css-file haben muss, auf welches jeweils zurückgegriffen wird. weil dann kann ich dort alle styles definieren, die dann für jede inhaltsseite gültig sind.

    so wie dus gemacht hast muss man demnach dann für die inhaltsseiten (lauftext, titel etc) doch noch ein css-file herstellen. der code im header ist nur für diese buttons zuständig, richtig? oder könnte man diesen head-code von dir auch in externes css-legen?
     
  19. caMi

    caMi New Member

  20. oli

    oli New Member

    ja! nimm bbedit, oder was auch immer, mach ein textfile und klopp nur die beiden stylesheet zeilen rein. speicher es ab unter sonstwas.css. wobei dann aber alle links so formatiert werden.
     

Diese Seite empfehlen