• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Brauche bitte Eure Hilfe!!!

Status
Für weitere Antworten geschlossen.
B

Blackforest

Neues Mitglied
Hallo an alle!
Ich habe eine Homepage gemacht und möchte gerne folgenden Effekt noch einbauen:
Wenn man mit der Maus über die Titel im Inhaltsverzeichnis der Unterseiten fährt, möchte ich gerne, daß der Titel dann unterstrichen wird. Aber ich kriege das nicht hin. Ich glaube, man nennt das einen "mouserollover"-Effekt, oder???
Hier die entsprechend Datei:
Code: 
[FONT=Verdana Standard][SIZE=2]<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Shared Top Border</title>
<meta name="GENERATOR" content="Microsoft FrontPage 5.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<meta name="Microsoft Theme" content="none">
<meta name="Microsoft Border" content="none">
</head>
<body>
<div align="center">
<center>
 
<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="700px" id="AutoNumber21">
<tr>
<td width="100%"><hr></td>
</tr>
</table>
 
<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="700px" id="AutoNumber66">
<tr>
<td width="100%">
<p style="text-align: center; line-height: 100%">
<font size="1" face="Verdana">
<a target="_top" href="http://www.Psychotherapie-Schwarzwald.de/index.htm" style="text-decoration: none">
<font size="1" color="#000000"><span style="font-weight: 400">Home</span></font></a> | 
<a href="http://www.Psychotherapie-Schwarzwald.de/adressen.htm" style="text-decoration: none">
<font size="1" color="#000000"><span style="font-weight: 400">Adressen (Links)</span></font></a> | 
<a href="http://www.Psychotherapie-Schwarzwald.de/aktuell.htm" style="text-decoration: none">
<font size="1" color="#000000"><span style="font-weight: 400">Aktuelles</span></font></a> | 
<a href="http://www.Psychotherapie-Schwarzwald.de/anfahrt.htm" style="text-decoration: none">
<font size="1" color="#000000"><span style="font-weight: 400">Anfahrt</span></font></a> | 
<a href="http://www.Psychotherapie-Schwarzwald.de/ausbildung.htm" style="text-decoration: none">
<font size="1" color="#000000"><span style="font-weight: 400">Aus-Bildung</span></font></a> | 
<a href="http://www.Psychotherapie-Schwarzwald.de/beratung.htm" style="text-decoration: none">
<font size="1" color="#000000"><span style="font-weight: 400">Beratung</span></font></a> | 
<a href="http://www.Psychotherapie-Schwarzwald.de/copyright.htm" style="text-decoration: none">
<font size="1" color="#000000"><span style="font-weight: 400">Copyright</span></font></a> | 
<a href="http://www.Psychotherapie-Schwarzwald.de/duerckheim.htm" style="text-decoration: none">
<font size="1" color="#000000"><span style="font-weight: 400">Dürckheim-Zentrum</span></font></a> | 
<a href="http://www.Psychotherapie-Schwarzwald.de/european.htm" style="text-decoration: none">
<span style="font-weight: 400"><font size="1" color="#000000">European Certificate</font></span></a> | 
<a href="http://www.Psychotherapie-Schwarzwald.de/formulare.htm" style="text-decoration: none">
<span style="font-weight: 400"><font size="1" color="#000000">Formulare</font></span></a> | 
<a href="http://www.Psychotherapie-Schwarzwald.de/zeichnen.htm" style="text-decoration: none">
<span style="font-weight: 400"><font size="1" color="#000000">Geführtes Zeichnen</font></span></a> | 
<a href="http://www.Psychotherapie-Schwarzwald.de/gesang.htm" style="text-decoration: none">
<span style="font-weight: 400"><font size="1" color="#000000">Gesang (Konzerte)</font></span></a> | 
<a target="_blank" href="http://www.disclaimer.de/disclaimer.htm" style="text-decoration: none">
<span style="font-weight: 400"><font size="1" color="#000000">Haftungsausschluß</font></span></a> | 
<a href="http://www.Psychotherapie-Schwarzwald.de/impressum.htm" style="text-decoration: none">
<span style="font-weight: 400"><font size="1" color="#000000">Impressum</font></span></a> 
| 
<a href="http://www.Psychotherapie-Schwarzwald.de/initiatische.htm" style="text-decoration: none">
<span style="font-weight: 400"><font size="1" color="#000000">Initiatische Therapie</font></span></a> | 
<a href="http://www.Psychotherapie-Schwarzwald.de/kontakt.htm" style="text-decoration: none">
<span style="font-weight: 400"><font size="1" color="#000000">Kontakt</font></span></a> | 
<a href="http://www.Psychotherapie-Schwarzwald.de/literatur.htm" style="text-decoration: none">
<span style="font-weight: 400"><font size="1" color="#000000">Literatur</font></span></a> | 
<a href="http://www.Psychotherapie-Schwarzwald.de/merkwuerdiges.htm" style="text-decoration: none">
<span style="font-weight: 400"><font size="1" color="#000000">Merk-Würdiges?</font></span></a> | 
<a href="http://www.Psychotherapie-Schwarzwald.de/leibtherapie.htm" style="text-decoration: none">
<span style="font-weight: 400"><font size="1" color="#000000">Personale Leibtherapie</font></span></a> | 
<a href="http://www.Psychotherapie-Schwarzwald.de/praktikum.htm" style="text-decoration: none">
<span style="font-weight: 400"><font size="1" color="#000000">Praktikum</font></span></a> | 
<a href="http://www.Psychotherapie-Schwarzwald.de/psychotherapie.htm" style="text-decoration: none">
<span style="font-weight: 400"><font size="1" color="#000000">Psychotherapie</font></span></a> | 
<a href="http://www.Psychotherapie-Schwarzwald.de/qualifikationen.htm" style="text-decoration: none">
<span style="font-weight: 400"><font size="1" color="#000000">Qualifikationen</font></span></a> 
| 
<a href="http://www.Psychotherapie-Schwarzwald.de/randy.htm" style="text-decoration: none">
<span style="font-weight: 400"><font size="1" color="#000000">Todesgefängnis Texas</font></span></a> | 
<a href="http://www.Psychotherapie-Schwarzwald.de/franziskus.htm" style="text-decoration: none">
<span style="font-weight: 400"><font size="1" color="#000000">St.-Franziskus-Stiftung</font></span></a> | 
<a href="http://www.Psychotherapie-Schwarzwald.de/supervision.htm" style="text-decoration: none">
<span style="font-weight: 400"><font size="1" color="#000000">Supervision</font></span></a> | 
<a href="http://www.Psychotherapie-Schwarzwald.de/veroeffentlichungen.htm" style="text-decoration: none">
<span style="font-weight: 400"><font size="1" color="#000000">Veröffentlichungen</font></span></a> | 
<a href="http://www.Psychotherapie-Schwarzwald.de/ziele.htm" style="text-decoration: none">
<font size="1" color="#000000"><span style="font-weight: 400">Ziele</span></font></a> </font></td>
</tr>
</table>
 
<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="700px" id="AutoNumber21">
<tr>
<td width="100%"><hr></td>
</tr>
</table>
 
</body>
</html>
Vielen Dank schon jetzt!
[/SIZE][/FONT]
 
Blackforest schrieb:
Hallo an alle!
Ich habe eine Homepage gemacht und möchte gerne folgenden Effekt noch einbauen:
Wenn man mit der Maus über die Titel im Inhaltsverzeichnis der Unterseiten fährt, möchte ich gerne, daß der Titel dann unterstrichen wird. Aber ich kriege das nicht hin. Ich glaube, man nennt das einen "mouserollover"-Effekt, oder???
Hier die entsprechend Datei:
Code: 
[FONT=Verdana Standard][SIZE=2]<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Shared Top Border</title>
<meta name="GENERATOR" content="Microsoft FrontPage 5.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<meta name="Microsoft Theme" content="none">
<meta name="Microsoft Border" content="none">
</head>
<body>
<div align="center">
<center>
 
<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="700px" id="AutoNumber21">
<tr>
<td width="100%"><hr></td>
</tr>
</table>
 
<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="700px" id="AutoNumber66">
<tr>
<td width="100%">
<p style="text-align: center; line-height: 100%">
<font size="1" face="Verdana">
<a target="_top" href="http://www.Psychotherapie-Schwarzwald.de/index.htm" style="text-decoration: none">
<font size="1" color="#000000"><span style="font-weight: 400">Home</span></font></a></font></td>
</tr>
</table>
 
</body>
</html>
[/SIZE][/FONT]

Vielen Dank schon jetzt!
Zum Vergrößern anklicken....

Hallo Blackforest,

mach das bitte nicht mit irgendwelchen automatisierten Funktionen eines WYSIWYG-Editors,
da die das alle mit JavaScript machen.
Abgesehen davon ist das von Dir verwendete FrontPage nicht gerade der beste WYSIWYG!
(die Angabe des Editors hat übrigens im Quelltext nichts verloren)

Schmeiß als allererstes alle style-Angaben aus dem Quelltext aller Seiten raus, denn die
machen Dir auf Dauer nur das Leben schwer.
Anschließend ist Dein Quelltext schon viel schlanker und übersichtlicher.
Jetzt legst Du ein zentrales Stylesheet an und bindest dies auf jeder Seite ein. Leg dafür
am besten einen Ordner "includes" an, in den Head-Bereich jeder Seite schreibst Du:
Code: 
<link href="includes/style.css" rel="stylesheet" type="text/css" />
(den Pfad zum Ordner musst Du gegebenenfalls anpassen)

Nun gibst Du jedem Link eine Klasse, das kann so aussehen:
Code: 
<a href="#" class="menue">Linktext</a>
in Deine CSS-Datei schreibst Du:
Code: 
a.menue {
         text-decoration:none;
}
a.menue:hover {
         text-decoration:underline;
}
Noch besser ist es, Du schreibst die gesamte Navigation in eine Liste:
Code: 
<ul class="navigation">
         <li><a href="#">Linktext</a></li>
         <li><a href="#">Linktext</a></li>
</ul>
CSS:
Code: 
ul.navigation {
         list-style-type:none;
}
ul.navigation li {
}
ul.navigation li a {
         text-decoration:none;
}
ul.navigation li a:hover {
         text-decoration:underline;
}
Die sonstigen Angaben musst Du sinnvoll ergänzen, dabei hilft Dir z.B.:
CSS 4 You - The Finest in Stylesheets: Workshop CSS: Allgemeines

Dort erfährst Du auch, wie Du Deine Seiten ohne das aufwändige und unübersichtliche
Tabellen-Konstrukt gestalten kannst.

Ich hab mir Deine Startseite kurz angeschaut:
  • bitte entferne die Laufschrift, das ist ein Relikt aus den 90ern des vergangenen Jahrhunderts
  • reduzier die Anzahl der Keywords auf maximal 10
  • der Title sollte aussagekräftig sein und nicht eine Ansammlung von Keywords
  • das gleiche gilt für die Description
Grüße
Bernhard
 
Vielen Dank, Bernhard, und allen, die mitgelesen haben!
Ich habe es einigermaßen hingekriegt; zumindest habe ich jetzt den mouse-rollover-Effekt geschafft.
Beste Grüße
Josef
 
Blackforest schrieb:
Vielen Dank, Bernhard, und allen, die mitgelesen haben!
Ich habe es einigermaßen hingekriegt; zumindest habe ich jetzt den mouse-rollover-Effekt geschafft.
Beste Grüße
Josef
Zum Vergrößern anklicken....

Hallo Josef,

im Internet Explorer funktioniert er, im Firefox nicht.
Probier mal:
Code: 
a:link  {
    color:#ffffff;
    text-decoration:none;
    }
a:hover  {
    color:#efefef;
    text-decoration:underline;
}
Bist Du Dir sicher, dass bei a:link die Schriftfarbe weiß sein soll?

Grüße
Bernhard


P.S.: die Laufschrift ist immer noch drin! Und (da ich's mir erst jetzt im IE angeschaut
habe, kommt das erst jetzt) der schwarze Scrollbalken geht mal gar nicht!
Beides kann Lieschen Müller auf ihrer privaten Website machen...
 
Status
Für weitere Antworten geschlossen.

Neueste Beiträge

Zurück
Oben