Suche im Forum:
Suchen


« Vorheriges Thema anzeigen :: Nächstes Thema anzeigen »  
Autor Nachricht
Beitrag03.06.2013 um 21:58 (UTC)    
Titel: onmouseover

Hallo zusammen,
bin blutiger Anfänger und möchte eigentlich nur ein Javascript erstellen
- Button mit Schriftzug, z.B. schwarzer Button, weisser Rahmen, drin: weiss geschrieben: 'Club'
wenn ich nun mit der Maus drüber fahre (onmouseover), dann sollen sich sowohl Farbe des Buttons, grau färben und der Schrift, weiss fett, ändern
und bei onmouseout, wieder in die Ausgangsposition stellen...

Wie müsste oder anders gesagt: Wie sieht der ganze Script aus...

Vielen Dank für die Hilfe...
tigub
Beitrag04.06.2013 um 03:37 (UTC)    
Titel:

brauchste kein Javascript dafür

hier ein Code für einen Button:

Arrow <a href="ZIELADRESSE.DE"><img src="BILDADRESSE-1.BILD" onmouseover="this.src = 'BILADRESSE-HOVERBILD';" /></a>
______________
MfG aus Klein Paris-vereinzelte Rechtschreibfehler sind Special Effects meiner Tastatur


Zuletzt bearbeitet von klein-paris am 04.06.2013, 04:43, insgesamt einmal bearbeitet
Beitrag04.06.2013 um 06:02 (UTC)    
Titel: Mouesover

klein-paris hat Folgendes geschrieben:
brauchste kein Javascript dafür

hier ein Code für einen Button:

Arrow <a href="ZIELADRESSE.DE"><img src="BILDADRESSE-1.BILD" onmouseover="this.src = 'BILADRESSE-HOVERBILD';" /></a>



Vielen Dank, aber ich möchte eben keine Bilder brauchen... sondern, nur sowas von: backgroundColor='#....

Aber eben wie genau..., das weiss ich eben nicht.....
Und vor allem nicht nur den backround sondern auch die Schrift....

tigub
Beitrag04.06.2013 um 06:33 (UTC)    
Titel:

Welche CSS-Eigenschaften du per JavaScript ansteuern kannst findest du hier.
Beispiel: this.style.color = '#ff0000';

Wieso du das aber mit JavaScript umsetzen möchtest ist mir schleierhaft, da du das auch per CSS mit der Pseudoklasse :hover umsetzen kannst. (Was auch funktioniert, wenn JavaScript im Browser deaktiviert ist.)
______________
Mit mir chatten? Besuche uns auf CookieChat.de (keine Anmeldung nötig, einfach einen Spitznamen einegeben)
Beitrag04.06.2013 um 06:58 (UTC)    
Titel: Mouseover

Ich würde das sicher mit CSS machen
wenn ich doch nur den genauen Code kennen würde und auch wissen wie das geht.. Wie gesagt bin totaler Laie.....

Oder hättest Du die Zeit und lust mir dies kurz zu schreiben?

Vielen Dank
Beitrag04.06.2013 um 07:32 (UTC)    
Titel:

Zunächst schriebst du den HTML-Code, also den Inhalt, den du anschließend mit CSS formatieren willst. In diesem Fall einen Link:
<a href="zielseite.html">linktext</a>
Weitere Infos: http://de.selfhtml.org/html/verweise/projektintern.htm#dateien

Außerdem gibst du diesem Link eine Klasse, die du per CSS ansteuern kannst:
<a href="zielseite.html" class="meinbutton">linktext</a>
Alternativ könntest du statt class auch id nutzen, dabei ist aber zu beachten, dass eine ID pro HTML-Seite nur ein einziges mal vorkommen darf. Mit Klassen hingegen kann man gleichartige Elemente zusammenfassen, bzw. verschiedene elemente einer Grurppe (Klasse) zuordnen, die wir per CSS ansteuern können.
Weitere Infos: http://de.selfhtml.org/html/attribute/allgemeine.htm#uebersicht

Da man bei homepage-baukasten.de keine CSS-Dateien hochladen kann (außer mit dem Premium Paket) müssen wir die CSS-Eigenschaften direkt im HTML-Code notieren. Dafür kannst du den style-Tag nutzen:
<style type="text/css">
<!--
Hierhin kommt der CSS-Code den ich im folgenden noch erkläre.
-->
</style>

An welcher Stelle du diesen Style-Block, der deinen gesamten CSS-Code enthält, plazierst ist im Prinzip egal. Um den Code aber auf jeder Seite deiner Hoempage zur Verfügung zu haben und ihn für alle Seiten gleichzeitig bearbeiten zu können, solltest du ihn z.B. bei "Text über dem Design" einfügen.
Weiere Infos http://de.selfhtml.org/css/formate/einbinden.htm#zentral

Um mit CSS die oben definierte Klasse "meinbutton" anzusteuern dient der Punkt:
.meinbutton { Hier die CSS-Eigenschaften, die für den Link gelten sollen. }
IDs steuert man mit # an. Auch kann man Regeln für alle Links definieren, indem man direkt "a {...}" notiert.
Weitere Infos: http://de.selfhtml.org/css/formate/zentrale.htm#klassen

Um einem Element ein anderes Aussehen zu verleihen, solange man es mit der Maus berührt, gibt es wie bereits erwähnt, die Pseudoklasse :hover
.meinbutton:hover { Hier die CSS-Eigenschaften, die für den Link gelten sollen, solange man ihn mit der Maus berührt. }
Weitere Infos: http://de.selfhtml.org/css/eigenschaften/pseudoformate.htm#link_visited_focus_hover_active

WAs nun noch fehlt sind die CSS-Eigenschaften und Wertzuweisungen an sich. Die Möglichkeiten an dieser Stelle sind vielfältig. Die von dir angesprochene Schrift- Hintergrundfabre und Fettdruck Eigenschatfen kann man wie folgt definieren:
color: green;
background-color: red;
font-weight: bold;

Weitere Infos: http://de.selfhtml.org/css/eigenschaften/index.htm
______________
Mit mir chatten? Besuche uns auf CookieChat.de (keine Anmeldung nötig, einfach einen Spitznamen einegeben)
Beitrag04.06.2013 um 10:09 (UTC)    
Titel: Mouseover

Very Happy

Vielen Dank
nun hoffe ich nur, ich bin nicht zu dämlich, dass ich es immer noch nicht kapier... Ansonsten würde ich mich wieder melden...

Oder unter uns. Hast Du eine Mail?

Nochmals vielen Dank
tigub
Beitrag04.06.2013 um 10:39 (UTC)    
Titel:

Da die Hilfestellung hier im Forum noch für andere Nutzer wertvoll sein kann ist E-Mail keine so gute Idee. Für Detailfragen findet man mich (und andere) auch oft im Chat (siehe Signatur). Wink

Wenn du dir dir von mir angeführten Links zu Gemüte führst sollte es in Kombination mit meinen Erläuterungen kein Problem sein, das hinzubekommen. Viel Erfolg. Razz
______________
Mit mir chatten? Besuche uns auf CookieChat.de (keine Anmeldung nötig, einfach einen Spitznamen einegeben)
Beiträge der letzten Zeit anzeigen:   


Powered by phpBB © 2001, 2005 phpBB Group
Deutsche Übersetzung von phpBB.de