NAVIGATION
This shows you the differences between two versions of the page.
deutsch:phpwcms-system:artikel:contentparts:register-tabs:jquery-ui-tabs [2010/02/15 23:56] Knut Heermann (flip-flop) |
deutsch:phpwcms-system:artikel:contentparts:register-tabs:jquery-ui-tabs [2018/06/03 18:08] (current) |
||
---|---|---|---|
Line 8: | Line 8: | ||
[[http://jqueryui.com/home|jQuery UI]] bietet Abstraktionen für Low-Level-Interaktion und Animationen, anspruchsvolle Effekte und sehr gute vorlagenfähige Widgets, auf der jQuery-Bibliothek aufbauend die verwendet werden können um interaktive Webanwendungen zu erstellen. | [[http://jqueryui.com/home|jQuery UI]] bietet Abstraktionen für Low-Level-Interaktion und Animationen, anspruchsvolle Effekte und sehr gute vorlagenfähige Widgets, auf der jQuery-Bibliothek aufbauend die verwendet werden können um interaktive Webanwendungen zu erstellen. | ||
+ | Möglich wird der Einsatz der jQuery Tabs erst durch die Verwendung dieses frontend_init-Scriptes: [[deutsch/ersetzer_rts/frontend_init/cp_trigger/sort-section]] | ||
\\ | \\ | ||
Line 24: | Line 24: | ||
Docu: -- \\ | Docu: -- \\ | ||
- | Forum: -- | + | Forum: -- \\ |
+ | Basis: [[http://jqueryui.com/demos/tabs/]] | ||
**Autor:** K.Heermann (flip-flop) http://planmatrix.de //2010/02/15 // \\ | **Autor:** K.Heermann (flip-flop) http://planmatrix.de //2010/02/15 // \\ | ||
Line 44: | Line 45: | ||
Verzeichnis: ** /template/inc_css/specific/jquery/themes/base/ ** | Verzeichnis: ** /template/inc_css/specific/jquery/themes/base/ ** | ||
+ | <note> | ||
+ | **Download: {{:deutsch:phpwcms-system:artikel:contentparts:register-tabs:jquery_ui_and_theme_172.zip|jQuery UI v1.7.2 - UI-JS & css-Themes}}** | ||
+ | \\ | ||
+ | \\ | ||
+ | |||
+ | **PHP:** [[deutsch/ersetzer_rts/frontend_init/cp_trigger/sort-section#php_script_v1.2]] //(Sortieren von Bereichen)// | ||
+ | |||
+ | </note> | ||
+ | |||
+ | **Bedingung:** -> [[http://www.phpwcms-docu.de/confincphp_de.phtml|/config/phpwcms/conf.inc.php]] \\ | ||
+ | * $phpwcms['allow_ext_init'] = 1; | ||
+ | * $phpwcms['allow_cntPHP_rt'] = 1; | ||
- | **Bedingung:** ##$phpwcms['allow_cntPHP_rt'] = 1;## -> [[http://www.phpwcms-docu.de/confincphp_de.phtml|/config/phpwcms/conf.inc.php]] | ||
---- | ---- | ||
- | ---- | ||
- | \\ | ||
+ | ~~UP~~ | ||
===== Beschreibung ===== | ===== Beschreibung ===== | ||
- | FIXME In Bearbeitung | ||
**1.** Update auf die jüngste Version | **1.** Update auf die jüngste Version | ||
Line 67: | Line 77: | ||
**3.** Installation: | **3.** Installation: | ||
* Erstelle aus den drei folgenden Texten die drei angegebenen Dateien in den angegebenen Verzeichnissen. | * Erstelle aus den drei folgenden Texten die drei angegebenen Dateien in den angegebenen Verzeichnissen. | ||
+ | * Installiere **PHP:** [[deutsch/ersetzer_rts/frontend_init/cp_trigger/sort-section#php_script_v1.2]] //(Sortieren von (Template) Bereichen)// | ||
**4.** Im Gebrauch: | **4.** Im Gebrauch: | ||
- | * Fülle eine CP Register/Tabs mit deinen Einträgen //(Siehe Beispiel oben)//. | + | * Fülle einen CP Register/Tabs mit deinen Einträgen //(Siehe Beispiel oben)//. |
* Wähle als Vorlage: **tab_sort_section_jquery.tmpl** | * Wähle als Vorlage: **tab_sort_section_jquery.tmpl** | ||
* Sichern und das Ergebnis im FE ansehen :-) | * Sichern und das Ergebnis im FE ansehen :-) | ||
+ | \\ | ||
Line 119: | Line 130: | ||
<!--TABS_START//--> | <!--TABS_START//--> | ||
- | <!--SORT_INTO_NEW_BLOCKS//--> | + | <!--SORT_INTO_NEW_BLOCKS_V12//--> |
[PHP] | [PHP] | ||
// =========================================================================== | // =========================================================================== | ||
- | // ---- Load the right css classes | + | // ---- Load all UI css classes |
$GLOBALS['block']['css']['jquery_ui_tabs'] = 'specific/jquery/themes/base/ui.all.css'; | $GLOBALS['block']['css']['jquery_ui_tabs'] = 'specific/jquery/themes/base/ui.all.css'; | ||
+ | |||
+ | // ---- Load the right UI css classes (Only these files are used for the tabs) | ||
+ | // $GLOBALS['block']['css']['jquery_ui_core'] = 'specific/jquery/themes/base/ui.core.css'; | ||
+ | // $GLOBALS['block']['css']['jquery_ui_tabs'] = 'specific/jquery/themes/base/ui.tabs.css'; | ||
+ | // $GLOBALS['block']['css']['jquery_ui_theme'] = 'specific/jquery/themes/base/ui.theme.css'; | ||
+ | |||
// ---- Load the right JS plugin | // ---- Load the right JS plugin | ||
Line 143: | Line 160: | ||
</script>'; | </script>'; | ||
- | |||
- | |||
- | |||
// =========================================================================== | // =========================================================================== | ||
Line 202: | Line 216: | ||
</code> | </code> | ||
+ | \\ | ||
==== CSS ==== | ==== CSS ==== | ||
- | Beispiel aus dem Theme Base: | + | Beispiel aus dem [[http://jqueryui.com/|jQuery UI]] Theme "Base": (Bitte schauen Sie sich die Funktionsweise der Themen genauer an.) |
**Datei:** /template/inc_css/specific/jquery/base/ui.all.css | **Datei:** /template/inc_css/specific/jquery/base/ui.all.css |