[backboneit_scripts] Eine Hand voll nützliche JS-Skripte

[backbone]

ER: http://www.contao.org/erweiterungsli...000009.de.html

Feedback bitte hier, Tickets demnächst auf contao-forge.de

[promo]

Hi backbone,

ich bin gerade am navigations-pulldown dran und bin mit Mootools nicht so verwandt. Für die Effekte "Siehe Mootools", wäre vll. eine Liste mit den Möglichkeiten Hilfreich oder eine Quelle wo man "Siehe Mootools" finden könnte.

Wäre nett, Danke :-)

[elmuerto]

Wie binde ich das scroll richtig ein?
Will meinen main .inside container scrollen.
Grüße

[backbone]

Ok, da die Frage in letzter Zeit häufiger kam:
Das Scrollscript in dieser Erweiterung ist eher ein Laufband (ähnlich dem guten alten marquee) und keine "Ich kann mit der Mausscrollen"-Area.

Letzteres kann man mit CSS-only umsetzen... das sieht zwar meist nicht schick aus, aber Websiten sollten sowieso nur 1 Scrollbalken haben und der ist ganz rechts außen und vom Browser gesetzt. Mit fixed und absolute Positionierungen kann man dann trotzdem fast alle Effekte bzgl "Mausscrollen" erreichen.

[elmuerto]

Super, danke! Hab's jetzt auch mit dem Standard Scrollbalken gelöst.

[Burek]

Irgendwie habe ich das noch nicht vollständig verstanden. Könnt ihr die Arbeitsschritte vielleicht ergänzen. Ich habe

1. Contao mit Music Academy Demo installiert.
2. Erweiterung backboneit_scripts installiert.
3. In den Layouts beim Mootools-Template "moo_navi_hoverpulldown" ein Häckchen gesetzt.
4. ...? Hier habe ich im CSS-Klasse der "Main navigation" folgendes eingetragen: hpd_{3}_{navi_hoverpulldown}[_active]

[backbone]

Die geschweiften (Pflichtangabe) und eckigen (optionale Angabe) Klammern müssen beim angeben der Klasse natürlich weg gelassen werden, das ist in der Beschreibung nur als Abgrenzung angegeben.


Was du willst ist das hier:
hpd_3_linear_active
oder
hpd_3_quadEaseOut_active

Wobei die Zeitangabe 3 hier nicht in Sekunden sondern in Millisekunden angegeben ist, d.h. du wirst von dem Ausfahren nicht vielsehen...

Also dann eher sowas:
hpd_3000_linear_active

[Burek]

Danke für die schnelle Antwort. Das Jahr ist ja noch jung, ich brauch da noch ein bisschen...
Die Vorschläge habe ich in der CSS-Klasse mal alle probiert (7000 Milisek. sogar verwendet), aber Effekte sehe ich keine.
Wo finde ich denn "Siehe mootools"? Sorry, ich kapiers immer noch nicht so wirklich.

[backbone]

http://mootools.net/

Es kann auch durchaus sein das das pull down menü mit der aktuellen HTML5 syntax nicht mehr klar kommt

[felixpfeiffer]

Es kann auch durchaus sein das das pull down menü mit der aktuellen HTML5 syntax nicht mehr klar kommt

Hallo,

diese Scripte sind wirklich der Hammer ;-)

Allerdings stimmt es, dass die Navi-Scripte in html5 Umgebungen nicht laufen, da nur auf div-Container oder Listen mit Klasse "hpd..." abzielen, nicht aber auf nav-Container.

Das sollte allerdings leicht änderbar sein. Wobei ich das jetzt noch nicht probiert habe, da ich die Seite, in der ich das zum ersten mal einsetze, erst aufbaue.

In der navi_hoverpulldown.js sollte es wohl so aussehen.

//hover fade menus	//hf_(int:duration)(_disabled)	$$("nav[class*=hpd_]", "div[class*=hpd_]", "ul[class*=hpd_]").each(function(ctx) {		var params = /(^|\s)hpd_(\d+)_([^\s_]+)(_disabled)?(\s|$)/.exec(ctx.get("class"));		params && hpd(			ctx.get("tag") == "ul" ? ctx : ctx.getFirst("ul"),			params[2].toInt(),			params[3],			params[4] ? true : false		);	});

Gruß, Felix

[andi-bar]

hallo,

ich versuche seit einer Weile herauszufinden, wie man mit CSS (und JS) Links auf einer Webseite faden lassen kann.
Ich habe dann diese Contao-Erweiterung hier gefunden und installiert, weil ich denke, dass es das ist, was ich gesucht habe.

Leider passiert bei mir gar nix, wenn ich es installiere.


habe eine Navi erstellt
habe der navi die klasse hf_999_0_0_click_active verpasst

im layout ist moo_navi_hoverfade aktiviert

was muss ich jetzt noch tun?
so richtig hab ich es glaube ich noch nicht verstanden


grüße,
Andi

[herr rilke]

guten morgen,

geht mir genauso wie dir, andi,

• moo_navi_hoverpulldown im layout aktiviert
• die klasse hpd_3000_linear_disabled im navi-template gesetzt.

in der seite ist auch alles da, JS und klasse.

aber es geschieht nichts, egal ob der doctype HTML5 oder xHTML(strict) ist.

hat das schon mal jemand ans laufen gebracht und kann einen kurzen hinweis geben ?


viele grüße!

[herr rilke]

und es bewegt sich doch...

mit der klasse hpd_300_linear im FE module zugewiesen,

bewegt sich der navigationspunkt und fährt auch zusammen, die untermenu-punkte bleiben aber sichtbar (trotz style="height:0", das dann zugewiesen wird) - und eigentlich verhält es sich genau verkehrt herum:

auf aktiven seiten ist es anfangs geschlossen und auf anderen seiten geöffnet.

[herr rilke]

mh,

habe mootoolsnav gefunden.

wunderbar

<seuzfz />

[andi-bar]

Hallo,

mootoolsnav ist aber eine eigene Navigation.
Ich möchte alle Links auf der Webseite faden lassen. Ob nun Bilderlinks oder Textlinks.

Kriege das mit Contao aber irgendwie nich hin.

[xchs]

Meinst Du so wie hier: http://davidwalsh.name/dw-content/fading-links.php

https://www.contao-community.de/show...-auch-ohne-CSS

[andi-bar]

danke für die links. das hatte ich auch schon gefunden. habs aber nicht hinbekommen.

[fooddesign]

Supper cool dies backboneit scripts.

Ich haben mir den navi_hoverpulldown installiert. Funktioniert auch alles bestens. Ausserd das bei jedem Reload der Seiten wieder alle ul.level_2 angezeigt werden wenn ich all RollOvere geht's wieder, bis ich erneut ein Menü an klicke.

Ausserdem möchte ich das beim Aktiven Menü das ul.lever_2 Sichtbar bleibt.

Hab nun x-Stunden versucht komme nicht weiter.

Jemand eine Idee

hier die Seite: http://www.amselspitz.ch/co/

[fooddesign]

Ich habe es nun mit dem Stylesheet geschafft. Die suche in Google nach manual suckerfish hat mir die Lösung gebracht.

Es lag eigentlich nur am
li ul: links-9999
und dann
li:hover ul links: auto;

wenn jemand mehr wissen will bitte melden.

[Hagen]

Hallo liebe Contao-Gemeinde,

ich verstehe noch nicht , wo die Klasse (z.B. hpd_3000_linear_active) genau zugewiesen werden soll. Tut man das im Navigationsmodul hat, bei html5, das <nav>-Element die Klasse. Dieses soll aber gar nicht "auf- und zuklappen" sondern eher das Element <ul class="level_2>. Zumindest in meinem Fall. Das würde auch das Problem beheben, dass das Script eventuell nicht mit dem <nav>-Element funktioniert. Allerdings gibt es das Problem, dass ich im normalen nav_default.html5 das <ul>-Element nicht finde. Gibt es für diesen Fall schon ein modifiziertes Template? Oder liege ich völlig falsch?

Für Hinweise bin ich dankbar
Schöne Grüße
Hagen

[backbone]

Hallo liebe Contao-Gemeinde,

ich verstehe noch nicht , wo die Klasse (z.B. hpd_3000_linear_active) genau zugewiesen werden soll. Tut man das im Navigationsmodul hat, bei html5, das <nav>-Element die Klasse. Dieses soll aber gar nicht "auf- und zuklappen" sondern eher das Element <ul class="level_2>. Zumindest in meinem Fall. Das würde auch das Problem beheben, dass das Script eventuell nicht mit dem <nav>-Element funktioniert. Allerdings gibt es das Problem, dass ich im normalen nav_default.html5 das <ul>-Element nicht finde. Gibt es für diesen Fall schon ein modifiziertes Template? Oder liege ich völlig falsch?

Für Hinweise bin ich dankbar
Schöne Grüße
Hagen

Einige der Skripte funktionieren leider noch nicht mit der HTML5 Version (aufgrund der unterschiedlich Tag-Namen). Das Skript sucht sich das erste ul unterhalb des klassen-tragenden Elements und benutzt dieses. Bei dem HPD habe ich auch grad ein paar arbeiten in der Pipe um das auf MooTools Klassen umzustellen, wo dann auch HTML5 Kompatibilität vorhanden sein sollte, leider habe ich keine Zeit zum testen, wenn das aber wer übernehmen möchte... ich sehe zu das ich die Erweiterung mal von SVN nach GitHub schiebe.