Override module et animation image

Réduire
X
 
  • Filtrer
  • Heure
  • Afficher
Tout effacer
nouveaux messages

  • [Problème] Override module et animation image

    Bonjour,

    Sur la page d'accueil de Cassiopiea, on a l'image de la nuit étoilés sous les sapins en position bannière avec son texte d'annonce.
    Je voudrais que cette image de module "bouge" avec du zoom css.

    J'ai réussie avec le css : animation: scale 40s linear infinite
    Le problème c'est que texte du module bouge aussi!

    C'est "l'injection" de l'image du module qui pose problème car je n'arrive pas à le dissocier de son texte.
    Le texte du module est dans la boite div "overlay" qui s'englobe avec les règles du backround-image.


    J'ai bien cette solution qui marche mais il faudrait remplacer la balise img par l'injection backgroundimage du module.
    Je sais pas faire,je bloque. Une aide s'il vous plaît? Merci

    Code PHP:
    <?php

    /**
    * @package Joomla.Site
    * @subpackage mod_custom
    *
    * Copyright (C) 2020 Open Source Matters, Inc. <https://www.joomla.org>
    * @license GNU General Public License version 2 or later; see LICENSE.txt
    */

    defined('_JEXEC') or die;

    use 
    Joomla\CMS\HTML\HTMLHelper;
    use 
    Joomla\CMS\Uri\Uri;

    $modId 'mod-custom' $module->id;

    if (
    $params->get('backgroundimage')) {
    /** @var Joomla\CMS\WebAsset\WebAssetManager $wa */
    $wa $app->getDocument()->getWebAssetManager();
    $wa->addInlineStyle('
    #' 
    $modId '{background-image: url("' Uri::root(true) . '/' HTMLHelper::_('cleanImageURL'$params->get('backgroundimage'))->url '");}
    '
    , ['name' => $modId]);
    }
    ?>

    <div class="mod-custom custom-banner" id="<?php echo $modId?>">
    <div class="boxint">
    <?php echo $module->content?>
    </div>
    </div>

    <div class="imgbg">
    <img src="images/gabarits/gab-slide-1.jpg" class="full zoom" alt="" />
    </div>

  • #2
    Bonjour, possible à faire avec https://up.lomart.fr/demo/action-anim-aos

    Bonne soirée
    JeFF

    Commentaire


    • #3
      Envoyé par Jeff71 Voir le message
      Bonjour, possible à faire avec https://up.lomart.fr/demo/action-anim-aos

      Bonne soirée
      Merci, mais pas en rapport avec ce que je cherche. Ce que je recherche n'est pas du hover, juste une image qui zoom à l'infini : animation: scale 40s linear infinite et, surtout que le texte "dessus" ne bouge pas ce que ne fait pas up. Si j'avais juste l'injection php désirée ce serait parfait.

      Commentaire

      Annonce

      Réduire
      Aucune annonce pour le moment.

      Partenaire de l'association

      Réduire

      Hébergeur Web PlanetHoster
      Travaille ...
      X