NAVIGATION
[[To Top Link]]
Differences
This shows you the differences between two versions of the page.
|
deutsch:andere-erweiterungen:jquery:to-top-link [2011/07/26 23:49] Knut Heermann (flip-flop) Page name changed from deutsch:andere-erweiterungen:jquery:to-top to deutsch:andere-erweiterungen:jquery:to-top-link |
deutsch:andere-erweiterungen:jquery:to-top-link [2018/06/03 18:09] (current) |
||
|---|---|---|---|
| Line 6: | Line 6: | ||
| **Ein Toplink Button erscheint autom. auf der Seite (fade in/out) wenn etwa 2/3 der Seitenlänge durch das Scrollen erreicht sind. ** | **Ein Toplink Button erscheint autom. auf der Seite (fade in/out) wenn etwa 2/3 der Seitenlänge durch das Scrollen erreicht sind. ** | ||
| - | Idee: David Walsh [[http://davidwalsh.name/jquery-top-link/|jQuery topLink Plugin]] \\ | + | Der "harte" Sprung zum Seitenanfang wird durch ein "SmoothScroll" ersetzt. Der User sieht also dass die Seite nach oben rollt. |
| - | Umgesetzt von: Matt Varone [[http://www.mattvarone.com/]] -> [[http://lab.mattvarone.com/projects/jquery/totop/|UItoTop jQuery dynamic scroll-to-Top plugin]] | + | \\ |
| + | |||
| + | **Idee:** David Walsh [[http://davidwalsh.name/jquery-top-link/|jQuery topLink Plugin]] \\ | ||
| + | **Umgesetzt von:** Matt Varone [[http://www.mattvarone.com/]] \\ | ||
| + | **Beispiel:** [[http://lab.mattvarone.com/projects/jquery/totop/|UItoTop jQuery dynamic scroll-to-Top plugin]] | ||
| \\ | \\ | ||
| Line 19: | Line 23: | ||
| **Autor:** Matt Varone \\ | **Autor:** Matt Varone \\ | ||
| - | wiki-Autor: K.Heermann (flip-flop) http://planmatrix.de) \\ | + | wiki-Autor: K.Heermann (flip-flop) http://planmatrix.de) 27.07.2011\\ |
| - | **CMS Version:** >= 1.4.7 (r430) \\ | + | **CMS Version:** >= 1.4.7 (r4xx) \\ |
| **Version:** V1.0 \\ | **Version:** V1.0 \\ | ||
| Line 54: | Line 58: | ||
| * Im HTML-Kopf der Vorlage wird die CSS-Datei geladen mit <code html><link rel="stylesheet" type="text/css" href="template/inc_css/specific/jquery/ui.totop.css" /></code> | * Im HTML-Kopf der Vorlage wird die CSS-Datei geladen mit <code html><link rel="stylesheet" type="text/css" href="template/inc_css/specific/jquery/ui.totop.css" /></code> | ||
| * In der Vorlage werden in "HAUPT:" an irgendeiner Stelle die JS-Plugins initialisiert <code html><!-- JS: easing.min --> | * In der Vorlage werden in "HAUPT:" an irgendeiner Stelle die JS-Plugins initialisiert <code html><!-- JS: easing.min --> | ||
| - | <!-- JS: easing.min --> | ||
| <!-- JS: ui.totop --> | <!-- JS: ui.totop --> | ||
| <!-- JS: ui.totop.head --></code> | <!-- JS: ui.totop.head --></code> | ||
| Line 138: | Line 141: | ||
| **Datei** ##template/lib/jquery/plugin/jquery.ui.totop.head.js## | **Datei** ##template/lib/jquery/plugin/jquery.ui.totop.head.js## | ||
| - | Dieser JS-Snipsel wird normalerweise direkt in den HEAD-Bereich der Seite eingetragen. Um die richtige Scriptreihenfolge einhalten zu können lagern wird diesen Teil als Plugin aus, das dann entsprechend geladen werden kann //(siehe oben im Text: "JS-Plugins initialisieren")//. | + | Dieser JS-Snipsel wird normalerweise direkt in den HEAD-Bereich der Seite eingetragen. \\ |
| + | Um die richtige Skriptreihenfolge einhalten zu können lagern wird diesen Teil als Plugin aus. \\ | ||
| + | Dieses Plugin kann nun in der richtigen Reihenfolge geladen werden. //(siehe oben im Text: "JS-Plugins initialisieren")//. | ||
| <code js|h jquery.ui.totop.head.js|h> | <code js|h jquery.ui.totop.head.js|h> | ||
