NAVIGATION
This shows you the differences between two versions of the page.
|
deutsch:andere-erweiterungen:jquery:simple-tabs [2012/03/07 14:02] Knut Heermann (flip-flop) |
deutsch:andere-erweiterungen:jquery:simple-tabs [2018/06/03 18:09] (current) |
||
|---|---|---|---|
| Line 6: | Line 6: | ||
| **Einfache Tabs basierend auf JQuery, mit denen CP´s gruppiert werden können.** | **Einfache Tabs basierend auf JQuery, mit denen CP´s gruppiert werden können.** | ||
| - | Mittlerweile ist es mit der Aktivierung der Einstellung **Register (Tabs)** ##x## im CP möglich, beliebige CP´s in Registern zu organisieren. | + | Mittlerweile ist es mit der Aktivierung der Einstellung **Register (Tabs)** ##x## im CP möglich, CP´s innerhalb eines Artikels in Registern zu organisieren. |
| Dazu müssen lediglich die Namen in **Register:** der zusammenzufassenden CP´s identisch sein und alle CP´s im selben **Abschnitt:** ##Nr## liegen. | Dazu müssen lediglich die Namen in **Register:** der zusammenzufassenden CP´s identisch sein und alle CP´s im selben **Abschnitt:** ##Nr## liegen. | ||
| Line 12: | Line 12: | ||
| Ein Abschnitt beinhaltet Register und ein Register beinhaltet CP´s. | Ein Abschnitt beinhaltet Register und ein Register beinhaltet CP´s. | ||
| + | <note> | ||
| + | **Dieses Verfahren eignet sich nur bedingt für Seiten die auch hörbehinderte gerichtet sind, da die Registernamen vom CP-Inhalt getrennt werden ** | ||
| + | </note> | ||
| {{:deutsch:andere-erweiterungen:jquery:register_tab_einstellung_fe01_1.gif|}} | {{:deutsch:andere-erweiterungen:jquery:register_tab_einstellung_fe01_1.gif|}} | ||
| Line 20: | Line 22: | ||
| \\ | \\ | ||
| ---- | ---- | ||
| + | ---- | ||
| + | \\ | ||
| **jquery.jQsimpleTabs.js** V1.0 07.03.12 | **jquery.jQsimpleTabs.js** V1.0 07.03.12 | ||
| Line 95: | Line 98: | ||
| - | ===== Code: ===== | ||
| - | |||
| - | In der Datei ##template/lib/jquery/plugin/jquery.jQsimpleTabs.js## ablegen. | ||
| - | |||
| - | |||
| - | <code js|h jquery.jQsimpleTabs.js|h> | ||
| - | /************************************************************* | ||
| - | * 07.03.12 | ||
| - | * | ||
| - | * JQuery Skript fuer das Gruppieren mehrerer CP´s innerhalb | ||
| - | * eines Registers im selben Abschnitt. | ||
| - | * | ||
| - | **************************************************************/ | ||
| - | |||
| - | $(function () { | ||
| - | var tabContainers = $('.tab-content'); | ||
| - | |||
| - | tabContainers.hide().filter(':first').show(); | ||
| - | |||
| - | // Wenn ein bestimmtes Register beim Seitenaufruf geoeffnet werden soll | ||
| - | //tabContainers.hide().filter('#tab-register-032').show(); | ||
| - | |||
| - | $('.tab-navigation a').click(function () { | ||
| - | tabContainers.hide(); | ||
| - | |||
| - | // Geschwindigkeit zum oeffnen der Tabs in ms (hier 500) | ||
| - | tabContainers.filter(this.hash).show(500); | ||
| - | |||
| - | $('.tab-container ul.tab-navigation a').removeClass('selected'); | ||
| - | $(this).addClass('selected'); | ||
| - | |||
| - | return false; | ||
| - | }).filter(':first').click(); | ||
| - | |||
| - | // Wenn ein bestimmtes Register beim Seitenaufruf geoeffnet werden soll | ||
| - | // }).filter('#tab-register-032').click(); | ||
| - | |||
| - | |||
| - | //Die folgende Zeile schlieszt alle Tabs beim Seitenaufruf. | ||
| - | //Soll der erste Tab geoeffnet sein, diese Zeile bitte loeschen oder auskomentieren. | ||
| - | |||
| - | // $('.tab-content').hide(); | ||
| - | |||
| - | }); | ||
| - | </code> | ||
| - | |||
| - | \\ | ||
| ===== Templates: ===== | ===== Templates: ===== | ||
| Line 246: | Line 202: | ||
| </div> | </div> | ||
| <!--IMAGES_FOOTER_END//--> | <!--IMAGES_FOOTER_END//--> | ||
| + | </code> | ||
| + | |||
| + | \\ | ||
| + | |||
| + | |||
| + | |||
| + | |||
| + | |||
| + | ===== Java-Script: ===== | ||
| + | |||
| + | |||
| + | In der Datei ##template/lib/jquery/plugin/jquery.jQsimpleTabs.js## ablegen. | ||
| + | |||
| + | |||
| + | <code js|h jquery.jQsimpleTabs.js|h> | ||
| + | /************************************************************* | ||
| + | * 07.03.12 | ||
| + | * | ||
| + | * JQuery Skript fuer das Gruppieren mehrerer CP´s innerhalb | ||
| + | * eines Registers im selben Abschnitt. | ||
| + | * | ||
| + | **************************************************************/ | ||
| + | |||
| + | $(function () { | ||
| + | var tabContainers = $('.tab-content'); | ||
| + | |||
| + | tabContainers.hide().filter(':first').show(); | ||
| + | |||
| + | // Wenn ein bestimmtes Register beim Seitenaufruf geoeffnet werden soll | ||
| + | //tabContainers.hide().filter('#tab-register-032').show(); | ||
| + | |||
| + | $('.tab-navigation a').click(function () { | ||
| + | tabContainers.hide(); | ||
| + | |||
| + | // Geschwindigkeit zum oeffnen der Tabs in ms (hier 500) | ||
| + | tabContainers.filter(this.hash).show(500); | ||
| + | |||
| + | $('.tab-container ul.tab-navigation a').removeClass('selected'); | ||
| + | $(this).addClass('selected'); | ||
| + | |||
| + | return false; | ||
| + | }).filter(':first').click(); | ||
| + | |||
| + | // Wenn ein bestimmtes Register beim Seitenaufruf geoeffnet werden soll | ||
| + | // }).filter('#tab-register-032').click(); | ||
| + | |||
| + | |||
| + | //Die folgende Zeile schlieszt alle Tabs beim Seitenaufruf. | ||
| + | //Soll der erste Tab geoeffnet sein, diese Zeile bitte loeschen oder auskomentieren. | ||
| + | |||
| + | // $('.tab-content').hide(); | ||
| + | |||
| + | }); | ||
| </code> | </code> | ||