Layout verzerrt !

[Fredoeoe]

Hey Leute,

ich habe mich gestern dran gesetzt und habe auf meine Seite ein neues Javascript auf den MouseOver Effekt gesetzt und zwar ein Fade Effekt, dadurch wirkt die Navi nicht so abgehackt !

Allerdings habe ich jetzt ein Problem, das Layout hat sich auseinander gezogen !

Hier mal zur Veranschaulichung -

<- Vorher

<- Nacher ( mit neuem Javascript )

Könnt euch ja mal die Quelltexte anschauen und ich habe auch gleich ein Testpaket geuploadet zum Ausprobieren ->

 

[bigpaul]

AW: Layout verzerrt !

Einmal der klasse .imgfader einen margin-top: -4px; geben
am andren bin ich noch..

Edit: Hmm.. das mit dem Hover krieg ich nich.. Ma gucken..

 

[Fredoeoe]

AW: Layout verzerrt !

bigpaul - Danke schonmal für deine Antwort

Sieht jetzt auf jedenfall schon besser aus aber ist noch nicht vollständig behoben

 

[sokie]

AW: Layout verzerrt !

mir gefällt das optisch recht gut, und zusammen mit dem script ist das schon ganz stimmig.
vielleicht solltest du dir diesen ganzen Tabellenverhau sparen, und das einmal konkret mit CSS umsetzen. Das würde die Sache wahrscheinlich einfacher machen - und zu dem zweinull Ding besser passen.

 

[Fredoeoe]

AW: Layout verzerrt !

Versteh nicht soooo viel von CSS ;]
Gibts da keine Alternative :O ?

Achja zum Aufbau der HTML, hab mir extra Mühe gegeben

 

[Dissolution]

AW: Layout verzerrt !

Versteh nicht soooo viel von CSS ;]
Gibts da keine Alternative :O ?

Achja zum Aufbau der HTML, hab mir extra Mühe gegeben

Dann lern es... ehrlich, ich hab mich so lange dagegen gewehrt, habs mir dann über Joomla bzw. Learning by doing angeeignet, es ist *****eneinfach wenn mans mal durchschaut hat.

Alternative? Nein, keine die schön ausschaut, du könntest natürlich deine eigene Programmiersprache erstellen, aber... lassma das besser

HTML ist nett für den Aufbau, aber Tabellen sind wirklich veraltet und nicht im geringsten Web 2.0

Die Seite sieht gar nicht schlecht aus, deshalb würd ich dir jetzt auch raten, voll und ganz auf Web 2.0 zu setzen und dir, wenigstens rudimentäre, Kenntnisse zu CSS anzueignen!

Liebe Grüße,
Dissolution

 

[Fredoeoe]

AW: Layout verzerrt !

Au man, dann muss ich mich wohl an SelfHTML wenden :]
Jippie, auf ein neues xP

Oder hat einer hier Workshops oder VideoTutorials die einem das einfacher machen :] ?

Naja, trotzdem Danke für deine Antwort Dissolution

 

[leohh]

AW: Layout verzerrt !

Das einzige Markup, dass du fuer diese Liste gebrauchen koenntest:

<div id="wrapper" style="width: 735px;">
		   
   <h1>Seitentitel</h1>
		   
   <ul id="nav">
      <li id="news"><a href="#" title="bild 1">News</a></li>
      <li id="about"><a href="#" title="bild 1">about</a></li>
      <li id="gallery"><a href="#" title="bild 1">Gallery</a></li>
      <li id="contact"><a href="#" title="bild 1">Contact</a></li>
   </ul>
		   
</div>

Im Stylesheet, floatest du noch die li Elemente - abschliessendes clearfix nicht vergessen.
Deinen Anchor-Tags, verpasst du deine Menuegrafiken und gibst ihnen noch ein display:block; mit mit den entsprechenden Breiten -bzw. Hoehenangaben. Und uber die :hover Pseudoklasse gibst du dem Anhochr-Tag dein Hover image mit.

Schon waere alles geritzt. Den Uebergang von den Bilder kannst du mit jQuery dann auch immer noch regeln und zwar ohne onClick und sonstige Fossilien. Ich hab jetzt leider nicht die Motivation mich durch deine Tabelle durchzuwuehlen, denn das ist imemr so anstrengend.

Die Grundidee ist im Uebrigen echt spitze!