[JavaScript] Mouseover?

Sabotage15 · 10. Dezember 2001

Mouseover?

Hab eine Frage...
zu Dreamweaver 3.
Ich weiß nicht wie ich einen Mouseover Effekt erziele.
Also das eine Schrift beim überqueren unterstrichen wird.

Könnte es mir jemand genau erklären?

weird · 10. Dezember 2001

mit dreamweaver selbst kenn ich mich nicht aus, aber in einer html datei an sich müsste das hier helfen, zumindest bei links:

Code:

<html><head>
<style type="text/css">
<!--
a:link {text-decoration:none;}
a:hover {text-decoration:underline;}
-->
</style></head><body>
<a href="http://www.yahoo.com/">yahoo.com</a>
</body></html>

ansonsten müsste man wahrscheinlich unterklassen in css definieren

greets, weird

koloth · 10. Dezember 2001

am besten gehts mit Javascript.

Fertige Scripte gibts z.B. hier:

http://www.sachen-fuer-webmaster.de/sections/op/listarticles/secid/6

http://www.rheinbreitbach.net/js-menue/

http://nome.dhs.org/elmue/ElmueSoft.htm

http://www.sgdev.com/

Peter · 10. Dezember 2001

Original erstellt von weird

ansonsten müsste man wahrscheinlich unterklassen in css definieren

greets, weird

Da kann man Unterklassen bauen?

Könntest du bitte mal ein zwei- bis dreizeiliges Beispiel posten?

Steffen · 11. Dezember 2001

Klassen

Code:

<html>
<head>
  <style type="text/css">
  <!--
  a.verweis {text-decoration:none;}
  a.verweis:hover {text-decoration:underline;}
  -->
  </style>
</head>
<body>
  <a class="verweis" href="http://www.yahoo.com/">yahoo.com</a>
</body>
</html>

Die Formatierungen im Stylesheet haben dann nur auf Links Auswirkung, bei denen man dem class-Attribut den Wert "verweis" zuweist. Für "verweis" kann man natürlich jeden beliebigen anderen Namen einsetzen, den man dann natürlich auch im Styelsheet selbst ändern muss!

Sabotage15 · 11. Dezember 2001

re

Danke...klappt.

Ich will nicht nun extra ein neuen Thread eröffnen....

wie nennt sich dieses Board...http://www.bywf.com/ /Message Board...was ich auf dieser Page gefunden habe?

weird · 11. Dezember 2001

@ steffen: danke, das du meine antwort 'übernommen' hast

@ koloth: also ich finde, dass es mit javascript ein bisschen umständlich ist...letzten endes greifft man ja trotzdem nur auf die style-eigenschaften zu, außerdem braucht man ja noch extra eventhandler usw usf

zu dem board, das is ein ganz normales perl-board. die übersicht mit allen threads wird in einer html-datei ausgegeben, die posts selbst sind durchnummeriert in einem message-ordner, von dem aus sie aufgerufen werden können (auch html-dateien). das cgi schreibt die message-datei und aktualisiert auch die index.html des forums selbst...einfachste variante eines boards...

Sabotage15 · 11. Dezember 2001

re

Es gibt ja viele verschiedene Perl-Boards...

welches entspricht am ehesten dem,von dem Link,den ich gepostet habe.

weird · 11. Dezember 2001

nun ja, namen kann ich für dafür jetzt spontan auch keinen, aber das ist so das modell, was zb von webspaceprovidern zur verfügung gestellt wird
im prinzip das 'billigste', was es gibt

koloth · 12. Dezember 2001

Original erstellt von weird
@koloth: also ich finde, dass es mit javascript ein bisschen umständlich ist...letzten endes greifft man ja trotzdem nur auf die style-eigenschaften zu, außerdem braucht man ja noch extra eventhandler usw usf

soo tief bin ich da bisher leider nicht eingestiegen. Und mangels Zeit wirds wohl voerst auch nicht. Alles, was ich vor 2 über Jahren in 9 Monaten Programmierkurs gelernt hatte (vor allem Java, etwas SQL, wenig PHP und HTML) verschüttet zur Zeit wieder, weil ich es beruflich nicht brauche, dort ziemlichen Stress habe und mir privat dadurch die Energie fehlt, die Kenntnisse wenigstens am Leben zu erhalten.

Prinzipiell interessieren mich elegante Lösungen aber immer.
Wenn Du mir ein gutes Tut weisst, immer her damit (selfhtml ist mir für für den Einstieg zu unübersichtlich). Mit nur 2 Wochen HTML war mit css nicht viel zu wollen.

weird · 12. Dezember 2001

naja, ich muss zugeben, dass ich auch immer mit selfhtml arbeite. wenn man einmal drin ist, isses wirklich sehr praktisch. ich kann über keine anderes tutorial zu html was sagen..

aber ich glaube nicht, dass das so ein großes problem für dich sein würde, speziell was jetzt css betrifft. du hast html-grundkenntnisse, was schon allein reichen würde um css zu verstehen, von deiner ganzen anderen programmier-erfahrung mal abgesehen. du weißt jetzt schon wie man css in html-dateien einbindet (auslagerung gibts auch noch, is aber nich sonderlich schwer und funzt genauso wie bei javascript), kennst die syntax für die definitionen (s. bsp) und hast jetzt bei stewi auch gelesen, wie das mit den unterklassen läuft.
dh, du müsstest bei selfhtml nur noch die den passenden eigenschaftstyp (zb textfarbe) raussuchen (is ja alles schon gegliedert) und die möglichen zuordnungswerte (hier etwa #000000 für hexadezimal schwarz, aber das kennst du ja sicher ^_^), fertig.
für normalen css einsatz reicht das alle mal aus

koloth · 12. Dezember 2001

na dann also mal wieder do it yourself (siehe sig, hehe).
Mal sehen, über die Feiertage habe ich zum ersten mal seit 2 Jahren fast 2 Wochen am Stück frei.
Wenn mir meine Frau den PC nicht wegschliesst

, werde ich mal wieder ein wenig Spaghetticode schreiben (lernen).

Irgendwas muss doch davon hängengeblieben sein, dass wir damals die Stunden im HTML-Code mit Notepad mitgeschrieben haben.
Nur den tue ich mit nicht mehr an, eher schon UltraEdit32 oder Phase-5.
Auf quick & dirty mit den großen Tools hab ich keinen Bock. Back to the roots.

weird · 13. Dezember 2001

na dann, viel spaß beim code lernen...
wenn du, was ich nicht glaube, fragen haben solltest, ich bin in dieser zeit auch da (icq/mail/pm)

ich werd mir deine links mal ansehen, denn seit mittlerweile über 2 jahren notepad.exe wirds langsam etwas unübersichtlich bei den ganzen scripts, und schneller wäre ich damit auch (alleine eine speichern-schaltfläche würde wahre wunder wirken...)

greets, weird

koloth · 14. Dezember 2001

wenn es Dir nur um den Speicherbutton geht, nimm EditPad. Ausserdem kann es mehrere Dateien gleichzeitig geöffnet halten. Das ist Postcardware *g* (Der Autor bittet um eine schöne Postkarte, da er diese sammelt). Das ist schon wieder so originell, dass man das eigentlich unterstützen sollte.

weird · 14. Dezember 2001

hehe, das is ja lustig, werds mir mal ansehen.
aber ein bisschen mehr als so eine schaltfläche bräuchte ich schon (zb farblich unterschiede zw tags und angezeigtem text auf der seite usw)
naja, und ne postkarte hab ich schon noch übrig ^_^

Sabotage15 · 14. Dezember 2001

re

Ich hab nochmal eine Frage...

ich hab auf http://www.bhwf.net/ ein cooles Menü entdeckt.
Ich weiß aber nicht,wie das Fenster unter dem Mouseover erscheint...?

weird · 14. Dezember 2001

das sind absolut positionierte div-anzeigebereiche, die ein- bzw augeblendet werden können (visibility eigenschaft)

Sabotage15 · 14. Dezember 2001

re

und wie könnte man das erstellen?

Steffen · 14. Dezember 2001

Ein kleiner, aber feiner Editor ist auch noch Proton (http://www.meybohm.de/)!

Wie weird schon sagte, wird das Menü auf der genannten Seite mit der CSS-Eigenschaft "Visibility" ein- und ausgeblendet. Ein Javascript hilft beim Ändern dieser Eigenschaft auf "visible", wenn man mit der Maus über einen der Obermenüpunkte fährt!

Bei dem COde kannst du dich ja auf der Seite etwas inspirieren lassen. Damit meine ich nicht einfach kopieren, sondern nachvollziehen und dann selber (besser) machen!

weird · 14. Dezember 2001

html-crash-kurs die zweite

aaallssooo:

du definierst einen div bereich:

Code:

<div id="menu1" style="position:absolute;top:50;left:40;visibility:hidden;">
hier die links reinschreiben, zb in einer tabelle</div>

nun musst du die anzeige dieses navigationselements regeln (mit javascript). für den menüpunkt 1 notierst du also also onmouseover funktion folgenden anweisung:

Code:

document.menu1.style.visibility='visible'

beim ausschalten onmouseout dementsprechend 'hidden'

<edit>
dann brauchst du ja noch ne zeitsteuerung, damit man das ganze auch vernünftig bedienen kann
beherzige am besten das, was steffen gesagt hat
du kannst dir das auch auf einer von mir erstellten seite mal ansehen: http://www.matthias-kirsten.de/ (copyright liegt bei mir)

uu musst du statt top und left margin-top bzw -left benutzen...
und wenn du den ganzen spass dann noch netscapekompatibel machen willst, wirds noch komplizierter (layertechnik)

wenn dich der ganze kram interessiert - und scheinbar willst du ja ne website machen - kann ich dir wirklich selfhtml empfehlen, damit kann man das alles lernen
</edit>

[JavaScript] Mouseover?

Cadet 4th Year

Lt. Commander

Ensign

Lt. Commander

Technische Leitung

Cadet 4th Year

Lt. Commander

Cadet 4th Year

Lt. Commander

Ensign

Lt. Commander

Ensign

Lt. Commander

Ensign

Lt. Commander

Cadet 4th Year

Lt. Commander

Cadet 4th Year

Technische Leitung

Lt. Commander

Ähnliche Themen