NAVIGATION
Differences
This shows you the differences between two versions of the page.
|
deutsch:phpwcms-system:artikel:contentparts:bilder-div:statische-bilder-klick-gallerie [2010/02/08 15:00] Knut Heermann (flip-flop) |
deutsch:phpwcms-system:artikel:contentparts:bilder-div:statische-bilder-klick-gallerie [2018/06/03 18:08] (current) |
||
|---|---|---|---|
| Line 4: | Line 4: | ||
| - | Eine einfache **CSS basierte** Bildergalerie , bei der das große Bild durch einen Klick auf das kleine Bild //(Thumbnail)// gewechselt wird. Es ist ebenso möglich, das gewünschte Bild im Link zur Seite direkt aufzurufen. Es wird **kein JavaScript** verwendet. | + | Eine einfache **CSS basierte** Bildergalerie, bei der das große Bild durch einen Klick auf das kleine Bild //(Thumbnail)// gewechselt wird. \\ |
| + | Es ist ebenso möglich, das gewünschte Bild im Link zur Seite direkt aufzurufen. Es wird **kein JavaScript** verwendet. | ||
| - | <note>**Funktioniert in allen Brosern außer Opera** //(Stand: V10.10 Build 1893)//. 8-O //(Markanteil: < 2%)// </note> | + | <note>**Funktioniert in allen Browsern außer Opera** //(Stand: V10.10 Build 1893)//. 8-O //(Marktanteil: < 2%)// </note> |
| Line 66: | Line 67: | ||
| [CP_TRIG_DEFINITION] // Begin Definiton | [CP_TRIG_DEFINITION] // Begin Definiton | ||
| - | [THUMBX_SUFFIX] .... [/THUMBX_SUFFIX] // Thumb-Block before | + | [THUMBX_PREFIX] .... [/THUMBX_PREFIX] // Thumb-Block before |
| - | [THUMBX_PREFIX] .... [/THUMBX_PREFIX] // Thumb-Block after | + | [THUMBX_PREFIX] .... [/THUMBX_SUFFIX] // Thumb-Block after |
| - | [IMAGEX_SUFFIX] .... [/IMAGEX_SUFFIX] // Image-Block before | + | [IMAGEX_PREFIX] .... [/IMAGEX_PREFIX] // Image-Block before |
| - | [IMAGEX_PREFIX] .... [/IMAGEX_PREFIX] // Image-Block after | + | [IMAGEX_SUFFIX] .... [/IMAGEX_SUFFIX] // Image-Block after |
| [/CP_TRIG_DEFINITION] // End Definiton | [/CP_TRIG_DEFINITION] // End Definiton | ||
| - | [CP_TRIG_WRAP_CONTENT] // Begin Content wrapper | + | [CP_TRIG_WRAP_CONTENT] // Begin where the result is placed into |
| [CP_TRIG_CONTENT] // Begin Content | [CP_TRIG_CONTENT] // Begin Content | ||
| - | [THUMBX] .... [/THUMBX] // Wrapper | + | [THUMBX] .... [/THUMBX] // designated area |
| - | [IMAGEX] .... [/IMAGEX] // Wrapper | + | [IMAGEX] .... [/IMAGEX] // designated area |
| [COUNTX] // Running Counter >0 | [COUNTX] // Running Counter >0 | ||
| Line 84: | Line 85: | ||
| [/CP_TRIG_CONTENT] // End Content | [/CP_TRIG_CONTENT] // End Content | ||
| - | [/CP_TRIG_WRAP_CONTENT] // End Content wrapper | + | [/CP_TRIG_WRAP_CONTENT] // End where the result is placed into |
| </code> | </code> | ||
| Line 152: | Line 153: | ||
| [CP_TRIG_DEFINITION] | [CP_TRIG_DEFINITION] | ||
| - | [THUMBX_SUFFIX] <ul id="thumbnails"> | + | [THUMBX_PREFIX] <ul id="thumbnails"> |
| - | [/THUMBX_SUFFIX] | + | |
| - | [THUMBX_PREFIX] <li class="close"><a href="#close"><img src="template/img/permanent_image_click_gallery/cancel_50x50.gif" alt="Close image" /></a></li> | + | |
| - | </ul> | + | |
| [/THUMBX_PREFIX] | [/THUMBX_PREFIX] | ||
| - | [IMAGEX_SUFFIX] <div id="fullsize"> | + | [THUMBX_SUFFIX] <li class="close"><a href="#close"><;img src="template/img/permanent_image_click_gallery/cancel_50x50.gif" alt="Close image"; /></a></li> |
| - | [/IMAGEX_SUFFIX] | + | </ul> |
| - | [IMAGEX_PREFIX] <div id="close"></div> | + | [/THUMBX_SUFFIX] |
| - | </div> | + | [IMAGEX_PREFIX] <div id="fullsize"> |
| [/IMAGEX_PREFIX] | [/IMAGEX_PREFIX] | ||
| + | [IMAGEX_SUFFIX] <div id="close"></div> | ||
| + | </div> | ||
| + | [/IMAGEX_SUFFIX] | ||
| [/CP_TRIG_DEFINITION] | [/CP_TRIG_DEFINITION] | ||
| Line 200: | Line 201: | ||
| ==== PHP: ==== | ==== PHP: ==== | ||
| - | **Datei:** /template/inc_script/frontend_init/cp_trigg_sort_section.php | + | **Datei:** /template/inc_script/frontend_init/cp_trigg_sort_section.php \\ |
| + | //(Alternativ kann auch dieser Programmteil [[deutsch/ersetzer_rts/frontend_init/cp_trigger/sort-section#php_script_v1.2]] verwendet werden. Die speziellen Tags müssen entsprechend angepasst werden)//. | ||
| <code php |h cp_trigg_sort_section.php |h > | <code php |h cp_trigg_sort_section.php |h > | ||
| Line 250: | Line 253: | ||
| if ($_text['definition'][1][0]) { // is there any content in definition section? | if ($_text['definition'][1][0]) { // is there any content in definition section? | ||
| - | if (preg_match('/\[THUMBX_SUFFIX\](.*?)\[\/THUMBX_SUFFIX\]/ism',$_text['definition'][1][0], $_text['pre_suf'][1])) | + | if (preg_match('/\[THUMBX_PREFIX\](.*?)\[\/THUMBX_PREFIX\]/ism',$_text['definition'][1][0], $_text['pre_suf'][1])) |
| $_text['thumb'] = $_text['pre_suf'][1][1] . $_text['thumb']; | $_text['thumb'] = $_text['pre_suf'][1][1] . $_text['thumb']; | ||
| - | if (preg_match('/\[THUMBX_PREFIX\](.*?)\[\/THUMBX_PREFIX\]/ism',$_text['definition'][1][0], $_text['pre_suf'][2])) | + | if (preg_match('/\[THUMBX_SUFFIX\](.*?)\[\/THUMBX_SUFFIX\]/ism',$_text['definition'][1][0], $_text['pre_suf'][2])) |
| $_text['thumb'] .= $_text['pre_suf'][2][1]; | $_text['thumb'] .= $_text['pre_suf'][2][1]; | ||
| - | if (preg_match('/\[IMAGEX_SUFFIX\](.*?)\[\/IMAGEX_SUFFIX\]/ism',$_text['definition'][1][0], $_text['pre_suf'][3])) | + | if (preg_match('/\[IMAGEX_PREFIX\](.*?)\[\/IMAGEX_PREFIX\]/ism',$_text['definition'][1][0], $_text['pre_suf'][3])) |
| $_text['image'] = $_text['pre_suf'][3][1] . $_text['image']; | $_text['image'] = $_text['pre_suf'][3][1] . $_text['image']; | ||
| - | if (preg_match('/\[IMAGEX_PREFIX\](.*?)\[\/IMAGEX_PREFIX\]/ism',$_text['definition'][1][0], $_text['pre_suf'][4])) | + | if (preg_match('/\[IMAGEX_SUFFIX\](.*?)\[\/IMAGEX_SUFFIX\]/ism',$_text['definition'][1][0], $_text['pre_suf'][4])) |
| $_text['image'] .= $_text['pre_suf'][4][1]; | $_text['image'] .= $_text['pre_suf'][4][1]; | ||
| } | } | ||
| Line 280: | Line 283: | ||
| \\ | \\ | ||
| + | |||
| ==== CSS: ==== | ==== CSS: ==== | ||
