Shrink Menu für Contao Projekt

**designpilot** · 09.02.2016, 14:03

An alle der Contao Community

Ich würde für ein Projekt gerne ein Menu wie folgt haben King's Casino Rozvadov . Es muss kein Mega Menu sein, einfach ein ganz normales Menu mit 4 Navigationspunkten (Home - Produkte - Über uns - Kontakt), des weiteren sollte wenn man nach unten scrollt die Infobar verschwinden und die Hauptnavigation und das Logo kleiner werden (die verkleinerung sollte so flüssig wie HIER vonstatten gehen und nicht so ruckartig wie beim obigen Link)

Ich habe hier schon mal (ich hoffe soweit korrekt) was an Code:

HTML-Code:

<div id="header">

<div id="infobar">HIER KOMMT DIE INFOBAR HIN</div>
<header class="header">
<a href="{{link_url::NAME ODER ID DER STARTSEITE/STARTPUNKT}}">{{image::PFAD ZUM LOGO}}</a>

<ul>
<li></li>
</ul>

</header>
</div>

hier ein wenig CSS

HTML-Code:

body {
	margin: 0;
	padding: 0;
}

#header {
	top: 0;
	position: fixed;
	height: 120px;
	width: 100%;
}

header {
	top: 30px;
	height: 90px;
	width: 100%;
	background-color: #000;
	color: #FFF;
}

#infobar {
	top: 0;
	height: 30px;
	width: 100%;
	background-color: #d2d2d2;
}

Ich weiss auch, dass auf der Musterseite die Infobar mit JavaScript ausgeblendet wird (die Infobar hat nach dem scrollen 1px an höhe, dies sieht man gut im Firebug) und merkt es auch wenn man den Browser rand oben genau anschaut.

Ich sehe im Moment den Wald vor lauter Bäumen nicht und wäre um jede Unterstützung froh

Ich habe mit meinem Freund, für den ich das realisieren sollte gesprochen und er wäre auch dazu bereit im Impressum der Seite einen Hinweis unter

Bildnachweis und Unterstützung

zu setzten inkl. Link auf die Internetseite

**zonky** · 09.02.2016, 15:54

dafür gibt es doch die Rubrik "Kleinanzeigen"

**designpilot** · 09.02.2016, 15:58

Zitat von zonky

dafür gibt es doch die Rubrik "Kleinanzeigen"

Hi Zonky
Ich wusst ned direkt ob ich es dort reinstellen soll, wenn das jemand verscheiben kann dann wäre ich froh darum. Oder würdest Du dich dem annehmen, Du siehst ja die Gegenleistung ???

**zonky** · 09.02.2016, 16:00

...stell´s da rein und vergleiche die "Preise"

zur "Gegenleistung" - ggf. erst Backlink setzen und bei einem neuen Auftrag gibt es das Navi "kostenlos" ;-)

**designpilot** · 09.02.2016, 16:16

Zitat von zonky

...stell´s da rein und vergleiche die "Preise"

zur "Gegenleistung" - ggf. erst Backlink setzen und bei einem neuen Auftrag gibt es das Navi "kostenlos" ;-)

Das Problem welches ich hab, auch wenns nur n Freund ist, dass ich das Projekt bis morgen Mittwoch online stellen muss. Darum such ich ja so nach jemandem der mir das machen könnte (ich weiss sonst gehörts in den KLEINANZEIGEN BEREICH).

**Samuell** · 09.02.2016, 16:46

Also für mich ist das nicht in maximal 30min getan, weil definitiv noch hier und da was zu feilen ist und auch eine responsive Ansicht passen muss.
Dann kommen schnell mal noch CSS-Altlasten dazu und schon dauert es doch ein paar Minuten Länger.
Aber vielleicht bin ich hier ja auch der Einzige, der das nicht schon als Vorlage herumliegen hat.

Wenn ich dann noch höre, dass es auf jeden Fall heute fertig werden muss und es dem Inhaber der Seite, also einem Geschäftsmann, nicht mehr als einen Backlink aus einem themenfremden Gebiet wert ist, fühle ich mich so sehr gewertschätzt, dass ich diese Zeit lieber hier im Forum lese und nebenbei ein Glas Wein trinke :-)

Daher viel Erfolg bei Deiner suche.

**designpilot** · 09.02.2016, 16:51

Danke Samuell für deine Antwort, ich kann Dich verstehen nur ich hätte mir zumindest erhofft das man mich dabei ein wenig unterstütz es muss ja nicht sein das mir jemand was pfannenfertiges gibt.

Ich bin um jede Hilfe dankbar, ich freu mich auch schon darüber wenn mir jemand Tipps gibt.

Das Beispiel mit dem King's Casino Rozvadov das is im Grund eine abgeänderte Version vom Tao Theme von RockSolid.

Ich sehe jetzt nicht ein wieso ich 149€ blechen soll wenn ich nur das Menu benötige. Und wenn ich das Menu hab darf ich s nur auf der einen Domain laufen lassen und für jede weiter müsst ich wiedee und wieder eine Lizenz kaufen.

Versteh mich nicht falsch, die Jungs von Rocksolid machen ne suuuper Arbeit keine Frage.

Wenn ich das Beispiel aus dem IRC Channel von Lucina anschau und davon ausgehend die kleinen Anpassungen die sicherlich gemacht werden müssten berücksichtige, dann ergibt das nicht mehr wie 30min Arbeit.

Javascript = max. 10 Zeilen Code
der rest ist jQuery was in Contao standard drin ist und CSS die anpassung das hätt ich dann auch noch hingekriegt. Aber ich weiss einfach nich was ich am nav_default alles ändern müsst da liegt mein Problem.

Aber danke für deine Hilfe (achtung Ironie)

**Samuell** · 09.02.2016, 16:58

Such Dir ein JS, dass beim Scrollen eine Klasse in das HTML einfügt.
Das div, dass Du veränderst muss die Navi und das Bild enthalten.

Hier ist ein älteres Beispiel mit mootools:
http://ck2013.may17.de/sticky-header.html

Das JS würde ich gegen JQuery austauschen.
Schließlich macht es nicht mehr als bei scroll eine CSS-Klasse zu setzen.
Damit sollte Dir geholfen sein

**designpilot** · 09.02.2016, 17:02

upps warst schneller als ich.

Danke Samuell ich werd das heut mal ausprobieren und Kumpel muss dan halt noch warten.

Gesendet von iPhone mit Tapatalk

**Socki** · 09.02.2016, 17:31

Servus, bzgl dem Scrollen und Klasse einfügen, das hatten wir doch unlängst erst im Forum:

https://community.contao.org/de/show...813#post396813

Änliches Script steht übrigens auch auf: ( Siehe Quelltext)
http://www.webdesignerdepot.com/cdn-...zing-menu-bar/
Gruß

**mlweb** · 09.02.2016, 21:45

Zitat von designpilot

Das Beispiel mit dem King's Casino Rozvadov das is im Grund eine abgeänderte Version vom Tao Theme von RockSolid.

Ich sehe jetzt nicht ein wieso ich 149€ blechen soll wenn ich nur das Menu benötige. Und wenn ich das Menu hab darf ich s nur auf der einen Domain laufen lassen und für jede weiter müsst ich wiedee und wieder eine Lizenz kaufen.

Versteh mich nicht falsch, die Jungs von Rocksolid machen ne suuuper Arbeit keine Frage.

Wenn ich das Beispiel aus dem IRC Channel von Lucina anschau und davon ausgehend die kleinen Anpassungen die sicherlich gemacht werden müssten berücksichtige, dann ergibt das nicht mehr wie 30min Arbeit.

Javascript = max. 10 Zeilen Code
der rest ist jQuery was in Contao standard drin ist und CSS die anpassung das hätt ich dann auch noch hingekriegt. Aber ich weiss einfach nich was ich am nav_default alles ändern müsst da liegt mein Problem.

Obwohl Du selbst nicht weißt, wie Du das Problem lösen solltest, gibst Du eine Einschätzung des Aufwandes ab.

Das gefällt mir.

**designpilot** · 09.02.2016, 22:16

Zitat von mlweb

Obwohl Du selbst nicht weißt, wie Du das Problem lösen solltest, gibst Du eine Einschätzung des Aufwandes ab.

Das gefällt mir.

Hi mlweb
Danke für deine Rüge, ich musste es jetzt auch lernen das es doch ned so einfach in 30min gelöst ist und möchte mich auch bei Samuell nochmals dafür entschuldigen. Ich steh dazu das es falsch war das einfach so zu sagen, aber für mich hatte es echt nicht nach mehr Arbeit ausgeschaut, ich hoffe das Ihr trotzdem mit mir nachsicht habt

**Socki** · 09.02.2016, 23:26

Wenn die Rübe voll ist, Monitor ausschalten , eine runde frische Luft schnappen und Köpfchen lüften.
Danach ist der Wald oft lichter

**Andreas** · 09.02.2016, 23:45

Wenn du es geschafft hast beim Scrollen eine CSS-Klasse in den Header zu beamen kannt du die Übergänge von einem Zustand zum anderen mit CSS transition einstellen.

**designpilot** · 10.02.2016, 06:58

In der Zwischenzeit konnte ich es mit Hilfe von Socki lösen (Danke nochmals Socki für deine Unterstützung und Aufzeigung meines Denkfehlers) . Jetzt ist alles viel klarer und ich kann das gewonnene auch für zukünftige Projekte umsetzen).

Danke Andreas für deinen Beitrag, hatte das auch mit Socki angeschaut.

Er hat auch gemeint das ich mal die Beiträge von Spooky anschauen soll (er sei was Contao anbelangt echt unheimlich)

Gesendet von iPhone mit Tapatalk