Slider home page fix menu mobile
This commit is contained in:
@ -11,6 +11,9 @@
|
||||
defined('_JEXEC') or die;
|
||||
|
||||
use Pcrt\Module\Highlights\Site\Helper\HighlightsHelper;
|
||||
use Joomla\CMS\Helper\ModuleHelper;
|
||||
use Joomla\CMS\Language\Text;
|
||||
use Joomla\CMS\Factory;
|
||||
|
||||
$elements = HighlightsHelper::getList($params);
|
||||
|
||||
@ -22,35 +25,120 @@ $field_name = !empty($tableField[1]) ? $tableField[1] : '';
|
||||
$opacita = $params->get('opacita', []);
|
||||
$sfondo = $params->get('sfondo', []);
|
||||
|
||||
defined('_JEXEC') or die;
|
||||
|
||||
|
||||
|
||||
|
||||
$wa = Factory::getApplication()->getDocument()->getWebAssetManager();
|
||||
|
||||
$wa->useStyle('swiper.css.styles', ['position' => 'before']);
|
||||
$wa->useScript('swiper.js.scripts');
|
||||
|
||||
|
||||
$wa->addInlineScript('
|
||||
window.addEventListener("DOMContentLoaded", function(){
|
||||
|
||||
var swiper = new Swiper(".sliderfull'. $module->id . '", {
|
||||
slidesPerView: "auto",
|
||||
spaceBetween: 0,
|
||||
loop: true,
|
||||
pagination: {
|
||||
el: ".swiper-pagination",
|
||||
clickable: true,
|
||||
},
|
||||
});
|
||||
});
|
||||
|
||||
', [], ['type' => 'text/javascript']);
|
||||
|
||||
|
||||
?>
|
||||
|
||||
<?php if (!empty($elements)) : ?>
|
||||
<div class="bd-example w-100">
|
||||
<div class="bd-example-tabs">
|
||||
<div class="row">
|
||||
<!-- Macro a sinistra -->
|
||||
<div class="col-4 col-md-3">
|
||||
<div class="nav nav-tabs nav-tabs-vertical nav-tabs-vertical-background" id="nav-vertical-tab-bg" role="tablist" aria-orientation="vertical">
|
||||
<?php foreach ($elements as $index => $element) : ?>
|
||||
<a class="nav-link <?php echo $index === 0 ? 'active' : ''; ?>" id="nav-vertical-tab-<?php echo $index; ?>-tab" data-bs-toggle="tab" href="#nav-vertical-tab-<?php echo $index; ?>" role="tab" aria-controls="nav-vertical-tab-<?php echo $index; ?>" aria-selected="<?php echo $index === 0 ? 'true' : 'false'; ?>">
|
||||
<?php echo $element->sottotitolo; ?>
|
||||
</a>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Contenuto a destra -->
|
||||
<div class="col-8 col-md-9">
|
||||
<div class="tab-content" id="nav-vertical-tab-bgContent">
|
||||
<?php foreach ($elements as $index => $element) : ?>
|
||||
<div class="tab-pane p-3 fade <?php echo $index === 0 ? 'active show' : ''; ?>" id="nav-vertical-tab-<?php echo $index; ?>" role="tabpanel" aria-labelledby="nav-vertical-tab-<?php echo $index; ?>-tab">
|
||||
<div><?php echo $element->titolo; ?></div>
|
||||
<div><?php echo $element->sottotitolo; ?></div>
|
||||
<div><?php echo $element->descrizione; ?></div>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<div class="<?= $params->get('moduleclass_sfx') ?>">
|
||||
<div class="position-relative">
|
||||
<div class="swiper sliderfull sliderfull<?= $module->id ?>">
|
||||
<div class="swiper-wrapper">
|
||||
<?php foreach ($elements as $index => $element) : ?>
|
||||
<div class="swiper-slide">
|
||||
<?php // Layout 50% test0 e 50% foto ?>
|
||||
<?php if ($element->classe == 'larghezza50') : ?>
|
||||
<div class="swiper-content <?= $element->classe; ?>">
|
||||
<div class="wrap-slide">
|
||||
<div class="container-lg px-0">
|
||||
<div class="caption-slide">
|
||||
<p class="title-slider">
|
||||
<?= $element->titolo; ?>
|
||||
</p>
|
||||
<p class="text-slider">
|
||||
<?= $element->sottotitolo; ?>
|
||||
</p>
|
||||
<a href="<?= $element->link_pulsante; ?>" class="btn btn-slide" title="<?= $element->testo_pulsante; ?>"><?= $element->testo_pulsante; ?></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row m-0">
|
||||
<div class="col-12 col-lg-6 order-lg-1 order-2">
|
||||
|
||||
</div>
|
||||
<div class="col-12 col-lg-6 order-lg-2 order-1 p-0">
|
||||
<div class="image-container" style="background-image: url(<?= $element->immagine_main; ?>)"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<?php // Layout 100% foto ?>
|
||||
<?php elseif ($element->classe == 'larghezza100') : ?>
|
||||
<div class="swiper-content <?= $element->classe; ?>">
|
||||
<div class="image-container" style="background-image: url(<?= $element->immagine_main; ?>)"></div>
|
||||
<div class="wrap-slide ">
|
||||
<div class="container-lg px-0">
|
||||
<div class="caption-slide">
|
||||
<?php if (!empty($element->immagine_secondaria)) : ?>
|
||||
<img src="<?= $element->immagine_secondaria; ?>" class="img-caption" />
|
||||
<?php endif; ?>
|
||||
<p class="title-slider">
|
||||
<?= $element->titolo; ?>
|
||||
</p>
|
||||
<p class="text-slider">
|
||||
<?= $element->sottotitolo; ?>
|
||||
</p>
|
||||
<a href="<?= $element->link_pulsante; ?>" class="btn btn-slide" title="<?= $element->testo_pulsante; ?>"><?= $element->testo_pulsante; ?></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<?php else: ?>
|
||||
<?php // Layout 100% foto testp boxed ?>
|
||||
<div class="swiper-content <?= $element->classe; ?>">
|
||||
<div class="image-container" style="background-image: url(<?= $element->immagine_main; ?>)">
|
||||
<div class="wrap-slide">
|
||||
<div class="container-lg px-0">
|
||||
<div class="caption-slide">
|
||||
<?php if (!empty($element->immagine_secondaria)) : ?>
|
||||
<img src="<?= $element->immagine_secondaria; ?>" class="img-caption" />
|
||||
<?php endif; ?>
|
||||
<p class="title-slider">
|
||||
<?= $element->titolo; ?>
|
||||
</p>
|
||||
<p class="text-slider">
|
||||
<?= $element->sottotitolo; ?>
|
||||
</p>
|
||||
<a href="<?= $element->link_pulsante; ?>" class="btn btn-slide" title="<?= $element->testo_pulsante; ?>"><?= $element->testo_pulsante; ?></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<div class="swiper-pagination"></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
Reference in New Issue
Block a user