Antworten auf deine Fragen:
Neues Thema erstellen

hauptmenü aber wie?

JoLe05

Nicht mehr ganz neu hier

hallo leute,

ich möchte gerne wissen wie man so ein Menü erstellt? Und zwar meine ich die hauptnavi(in rot)...


alleine mit einem hover effekt ist es nicht getan, den der erscheint sofort und es sieht einfach nicht schön aus...

kann man das nur mittels js umsetzen? ich habe mal von jquery gehört, weiss aber noch nicht was das ist(bin noch am anfang)

danke für eure hilfe und tips
 

JoLe05

Nicht mehr ganz neu hier

AW: hauptmenü aber wie?

vielen dank, werd ich mir gleich reinziehen

ich schätze mal probleme gibt es bei IE
 

simonpicos

Mod | Forum

AW: hauptmenü aber wie?

Ja, das wird es.. Selbst der IE9 unterstützt CSS3 nur in sehr begrenztem Maße.
Mit der 10er Version (gibts bereits mit Windows 8 ;) ) ändert sich das glücklicherweise :)
 

manfred_hst

Nicht mehr ganz neu hier

AW: hauptmenü aber wie?

das ist ein superfish-menu, kann man im Seitenquelltext nachlesen. und noch ein wenig mit transitions aufgepeppt. funktioniert auch im IE9.
 

simonpicos

Mod | Forum

AW: hauptmenü aber wie?

Gerade für ein einfaches drop-down-menü finde ich braucht es noch nicht mal jQuery. Das kann man komplett mit CSS lösen. Die alten Browser unterstützen dann halt eben nicht die schönen fadings und so ;)
Aber wer mit nem alten Browser surft ist selbst schuld.. (Mal von den Leuten abgesehen, die auf ihrem Arbeitsplatz nur so was altes haben)
 

JoLe05

Nicht mehr ganz neu hier

AW: hauptmenü aber wie?

hmm irgendwie will das nicht klappen! vll könnte mir einer helfen

html:
<div id="menue">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Arts</a></li>
<li><a href="#">Partners</a></li>
<li><a href="#">Kontakt</a></li>
<li><a href="#">Impressum</a></li>
<li><a href="#">Social</a></li>
</ul>
</div>

css:
#menue{ margin-top: 40px; height: 70px; background: url(../images/menue1.jpg) repeat-x;
-webkit-transition: all 2s ease;
-moz-transition: all 2s ease;
-o-transition: all 2s ease;
transition: all 2s ease; }
#menue a:hover{ background: url(../images/menue_hover.jpg);}
#menue ul { list-style: none; float: left;}
#menue ul li { float: left;}
#menue li a { float: left; display: block; padding: 0 42px; line-height: 70px; color: #fff; background: url(../images/menue_trennstrich.jpg) top right no-repeat; }
 

simonpicos

Mod | Forum

AW: hauptmenü aber wie?

Was funktioniert denn nicht?
Ich gehe mal davon aus, dass es das Hintergrundbild ist. Diese können (noch?) nicht mit CSS animiert werden.

p.s. es gibt hier ein codewerkzeug in der Ansicht "erweitert" ;)
 

LaFaSiLuc

pauschalschuldig

AW: hauptmenü aber wie?

Nein, da wird auch kein Bild animiert, sondern nur die Farbfläche "vergrößert" :)

PS: Superfish ist doch nur dieses ausgeklappte, oder was war das noch?
 

JoLe05

Nicht mehr ganz neu hier

AW: hauptmenü aber wie?

ups sorry :)

naja er wendet den effekt halt nicht an... schade aber wie hat der typ das dann hinbekommen, weil der hat auch images benutzt für den hoover effekt....
 

simonpicos

Mod | Forum

AW: hauptmenü aber wie?

jap, LaFa, das wars ;)

also auf der site ist das so gelöst, dass das hover-bild in einem eigenen strong-tag hinterlegt ist. Dieser ist dann im Normalzustand um 50px nach unten geschoben (mit transform:translate) und die opacity ist auf 0 gesetzt. Bei hover wird das Bild hochgeschoben und die opacity hochgedreht ;)
 

JoLe05

Nicht mehr ganz neu hier

AW: hauptmenü aber wie?

ach herje :)

danke für den tip ich werd das dann gleich mal ausprobieren...

aber iwann muss das halt schon kommen das mit css3 auch pics animiert werden können...
 
Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Antworten auf deine Fragen:
Neues Thema erstellen

Willkommen auf PSD-Tutorials.de

In unseren Foren vernetzt du dich mit anderen Personen, um dich rund um die Themen Fotografie, Grafik, Gestaltung, Bildbearbeitung und 3D auszutauschen. Außerdem schalten wir für dich regelmäßig kostenlose Inhalte frei. Liebe Grüße senden dir die PSD-Gründer Stefan und Matthias Petri aus Waren an der Müritz. Hier erfährst du mehr über uns.

Stefan und Matthias Petri von PSD-Tutorials.de

Nächster neuer Gratisinhalt

03
Stunden
:
:
25
Minuten
:
:
19
Sekunden

Flatrate für Tutorials, Assets, Vorlagen

Zurzeit aktive Besucher

Statistik des Forums

Themen
118.635
Beiträge
1.538.476
Mitglieder
67.559
Neuestes Mitglied
hanuta
Oben