Beiträge von yeti66

yeti66

Hi!
Die Optik muß ich ganz ehrlich sagen finde ich prima. Als ich mir den Code in den Dreamwaver geladen habe (zu lernzwecken) hat`s die Seite in der Entwurfsansicht ganz schön gewürfelt. In der Überzeugung, das da noch was möglich ist habe ich mir erlaubt den Code etwas zu bereinigen und umzuschreiben. Natürlich immer mit dem Ziel die Gesamtoptik beizubehalten.
Ja und so sieht das Ergebnis aus (siehe Anhang):
In der Entwurfsansicht sauber, wenn da nicht der Makel der nicht bündigen Inhalte der Leiste links und des mittleren Abschnitts wären. Ich war bemüht es extra nur mit Tabellen zu lösen. Mit CSS-Layout und Containern ist es natürlich einfacher.
Wo liegt mein Fehler??

Gruß yeti66

yeti66

Das ist nur was für JavaScript. Poste es dort mal. Gehen wird sicher alles. Es ist nur eine Frage des Aufwandes.

Gruß yeti66

yeti66

HTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Deine Seite</title>
<script type="text/JavaScript">
<!--
function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}


function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}


function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}


function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
</head>
<body bgcolor="#BDC6DE">
<table width="780" border="0" align="center">
  <tr>
    <td align="center">[url='xxx'][img]Original1.jpeg[/img][/url]</td>
    <td align="center">[url='xxx'][img]Original2.jpeg[/img][/url]</td>
    <td align="center">[url='xxx'][img]Original3.jpeg[/img][/url]</td>
  </tr>
</table>
</body>
</html>

Alles anzeigen

Pfade von Original1/2/3.jpeg und Rollover1/2/3.jpeg ändern und los gehts.

Gruß yeti66

yeti66

Hier habe ich Dir noch ein Layout mit den Button gemacht, die Dir sicher vorschweben. Leider funktioniert es momentan (exakte Positionierung unter allen Browsern) nur unter Firefox. Vielleicht findet sich jemand, der sich den Code ansieht und den Fehler findet. Aber vom Buttonlayout ist das sicher Dein Ziel.

Gruß yeti66

yeti66

Oh,sorry da fehlte noch was.
http://www.drweb.de/csspraxis/schnelle_schatten.shtml

bzw. im css von:

Code

div#inactive{
	width:80px;
	height:20px;
	padding-top:6px;
	background-color:#E8961A;
	font:Verdana, Arial, Helvetica, sans-serif;
	float:left;
	overflow:hidden;
	color:#FFFFFF;
}


div#activemain{
	background-color: #FFFFFF; 
	width:80px;	
	height:20px;
	padding-top:6px;
	float:left;
	overflow:hidden;
}

Alles anzeigen

mit Border top,Border right, border color: sw einen Rand als Pseudoschatte setzen. Leider ist Deine Seite total konfus und seit heute im Firefox und Explorer zerhackt. Sonst hätte ich es Dir gemacht. Du mußt Deinen Code besser strukturieren da blickt ja keine durch.
Am besten Du baust Deine Seite neu auf.
Hier ein Beispiel asl Dreiteiler:

Gruß yeti66

yeti66

Zitat aus "XHTML;CSS & Co" von Stefan Mintert:
Beachten Sie, dass die Regel a:hover nach den Regeln für a:link und a:visited platziert werden muss, weil die kaskadierenden Regeln sonst die `color`-Eigenschaften der Regel für a:hover verbergen.
Beispiel:

a:link {} /*nicht besuchte Links*/
a:visited {} /*besuchte Links */
a:hover {} /*Benutzer selektiert */
a:active {} /*aktive Links */

Gruß yeti66 recht hat er der Ronald

Da wird man alt wie `ne Kuh und lernt immer noch was dazu

yeti66

Wie wäre es,wenn Du

Code

dd a:visited{
   color:#85817B;}

einfach löscht??

Gruß yeti66

yeti66

a:hover statt a:link !!!

yeti66

Ach ja die Frage war ja warum.
Ob a.navi oder nur als .navi macht hier als Klasse keinen Unterschied. Ist a:link als Pseudoklasse nicht definiert bestimmt die Klasse .navi wo es lang geht. Ist beides definiert hat der Browser wohl Interpretationsschwierigkeiten. Nun, hauptsache es geht.
Oder nicht?

Gruß yeti66

yeti66

Also wenn, dann würde ich es eher so machen.

Code

a.navi
{
   font-family: verdana;
   font-size: 9px;
   text-align: center;
   font-weight: bold;
   text-decoration: none;
   color: #E78307;
}


a:hover
{
   font-family: verdana;
   font-size: 9px;
   font-weight: none;
   text-decoration: underline;
   color: #8C8C8C;
}

Alles anzeigen

Bei mir funktioniert es jedenfalls. Ich habe die Seite aber noch nicht online. Wenn Du einen link setzen würdest sehe ich es mir mal an.

Gruß yeti66

yeti66

Ok.
Hier hast Du eine Lösung für die Schatten mit CSS. Einfach zwei Layer übereinader legen und ein oder zwei pixel ind er Höhe und seitlich versetzen.
Dann wirst Du aber mit absoluter Positionierung arbeiten müssen. Dafür entfällt die Zeile

Code

<div style="float:left; width:12px; height:1px;"> </div>

pro Button.

Bye yeti66

yeti66

Ich habe hier ein Vorschlag mit einem überarbeiteten Code der Seite. Das Layout ist mit Containern angelegt und zentriert. Du brauchst nur noch "content","navre"(navigation-rechts) und "infore"(info-rechts) zu füllen und eventuelle Pfade der Bilder neu zuzuordnen.

Bye yeti66

yeti66

Das Formular richtet sich doch nach dem, was Du abfregen willst. Aussehen könnte es so:

<form id="feedback" action="(EmptyReference!)" method="post" name="FormName">
<label>Vorname:</label><input type="text" name="vorname">
<label>Nachname:</label><input type="text" name="nachname">
<label>Strasse:</label><input type="text" name="strasse">
<label>Ort:</label><input type="text" name="ort">
<label>PLZ:</label><input type="text" name="plz">
<label>Organisation:</label><input type="text" name="Organisation">
<label>E-Mail:</label><input type="text" name="email">
<label>Telefon:</label><input type="text" name="tel">
<label>Fax:</label><input type="text" name="fax">

<label>Kategorie:</label><select name="kategorie" size="1">
<option value="1">Anfrage</option>
<option value="2">Servicemitarbeiter</option>
<option value="3">Organisation</option>
<option value="4">Produkte</option>
<option value="5">Serviceangebot</option>
<option value="6">Website</option>
</select>
<textarea name="kommentar" ></textarea>
<input type="reset" id="but1" value="zurücksetzen">
<input type="submit" id="but2" name="submitButtonName" value="Feedback abschicken">
</form>

Eleganter geht es aber auch:
Programm unter: http://www.grammiweb.de/downloads/formulareditor.shtml
Anleitung unter : http://www.grammiweb.de/anleitungen/ka_formulareditor.shtml

Gruß yeti66

yeti66

Nun ja, die erste Wahl in so einem Fall wäre CMS.
Wenn das Layout (Aufteilung der Seite usw.) gleich bleibt und sich nur die Optik ändern soll (Hintergrund,Button usw.), dann stell`Deine Seite auf CSS um. So legst Du das Layout in Containern (<div></div>) an und definierst sie in einer externen Datei (z.B. als layout.css ). In dieser Datei legst Du die Position,Font,Hintergründe usw. der Container fest. Der reine Text ist dann übersichtlicher unter der html-Datei zu ändern.

Gruß yeti66

yeti66

marlow,
Sicher, wenn Du mich direkt anschreiben willst.
Unter der Adresse
http://harzurlauber.de/impressum.html und
unter Adresse
http://harz-achat.de/impressum.html
findest Du meine e-mail-adresse unter Design und Programmierung.

Wir hören uns? Bye yeti66

yeti66

Schöne Seite , einzig bei .....Euch gefällt unsere Seite? Dann gebt uns diesen Monat eure Stimme auf [Besucheraward.de]! Vielen Dank dafür!....springt es.
Ist das erwünscht?

Gruß yeti66

yeti66

Siehe auch : https://www.forum-hilfe.de/viewtopic.php?t=12979

yeti66

Dein Problem passt sicher besser in ein javascript-Forum. Trotzdem würde ich empfehlen so wenig wie möglich mit javascript zu arbeiten, da immer mehr User aus Sicherheitsgründen javascript abschalten. Der oder die Links funktionieren dann zwar noch aber ohne dem Rollover-Effekt. Das gleiche kann man aber auch mit CSS erreichen und das sollte man auch tun.

Gruß yeti

yeti66

Wenn Du auf die Seite von seflhtml http://de.selfhtml.org/navigation/suc…Suchanfrage=pre
gehst bist Du voll im Bilde. Hier kannst Du Dir auch die neuste Version:
SELFHTML 8.1 herunterladen um OFFLINE zu schmökern.
http://aktuell.de.selfhtml.org/extras/download.shtml

Gruß yeti66

yeti66

Gast, siehe oben
wenn Du Dich mit den kostenlosen Bildchen auf Knuddels.de beziehst, so ist die die Auswahl der Hintergrundbilder im Pulldownmenue kostenlos und müssen dort nur ausgewählt werden. Den Rest das "hochladen"übernimmt mit betätigen des "Erstellen"Buttons die knuddelseite.

So wie ich das sehe ist eine Bearbeitung der Seite mit einem externen Editor nicht möglich.

Gruß yeti66

Beiträge von yeti66

African-Reptiles.com

Formularfelder

onmouseover anfängerfehler?

button:schlagschatten fehlt!!

button:schlagschatten fehlt!!

Schriftfarbe beim Hovern - Links

Schriftfarbe beim Hovern - Links

css problemchen

css problemchen

css problemchen

button:schlagschatten fehlt!!

Problem mit css Positionierung

Einfaches Formular

Bitte um Hilfe! Jede Textseite mit Design gestalten?

Bildverschiebung bei neuem Hintergrund

Tabelle mit Hintergrund soll fixiert werden

Website Hintergründe

Probleme mit Mouseover und openWindows

HTML Tags als Text anzeigen

Eigene Bilder als Hintergrund