Předelání galerie na swipe na mobilu

Úvodní strana

Články

Návody

Jak předělat galerii na mobilu, aby byla na swipe

13.9.2023 67x Návody

Celkem 3 články z rubriky: Návody

předchozí článek

Na první článek

změnit vypusování obrázku

z původního:
<a id="20" class="fancybox" rel="gallery" href="https://trickar.cz/images/preview/7199340-1687785617.jpg" title="" style="position: absolute; width: 212px; margin: 2px; top: 159px; left: 2px; transition: all 0.5s ease 0s;">
<img src="https://trickar.cz/images/thumbnail/7199340-1687785617.jpg" alt="" style="width: 212px; display: block;">
</a>

předělat na:
<div class="swipeGallery">
<img alt="popis obrázku" src="https://www.ecanis.cz/images/preview/1738034-1637941369.jpg" data-preview="https://www.ecanis.cz/images/preview/1738034-1637941369.jpg"></div>

zjistí, zda je mobil (pozor na adresu k souboru), vypsat bur $r nebo změnit na echo

require_once './admin/Mobile-Detect-2.7.0/Mobile_Detect.php';
$detect = new Mobile_Detect;
			if ($detect->isMobile()) {
				$r .= ($data['foto'] != "" ? "<div class='swipeGallery'><img class='foto-onlajny' src='{$cfg['forModRewrite']}/images/onlajny/thumbnail/{$data['foto']}' data-preview='{$cfg['forModRewrite']}/images/onlajny/preview/{$data['foto']}'  title='" . $bbParser->parse($data['text']) . "'/></div>" : "");
			} else {
				$r .= ($data['foto'] != "" ? "<div class='swipeGallery'><a title='" . $bbParser->parse($data['text']) . "' href='{$cfg['forModRewrite']}/images/onlajny/preview/{$data['foto']}' class='fancybox' ><img class='foto-onlajny' src='{$cfg['forModRewrite']}/images/onlajny/thumbnail/{$data['foto']}'  title='" . $bbParser->parse($data['text']) . "'/></a></div>" : "");
			}

na mobil/index.php nahrát

<script src="<?= $cfg['forModRewrite'] ?>/mobil/js/touchSwipe.js"></script>
<script src="<?= $cfg['forModRewrite'] ?>/mobil/js/swipeGallery.js"></script>

Do složky mobil/js nahrát soubot touchSwipe.js (je např. na ecanis.cz)

Akce s článkem

Doporučit známému
Vytisknou článek

Podobné články

Vícerozměrný for cyklus

Google fonts s českou diakritikou

Návody (3)CSS styly - tipy a rady (1)PHP manuál (1)

Návody (3)
PHP manuál (1)