En poursuivant votre navigation sur ce site, vous acceptez l'utilisation de cookies pour vous proposer des contenus et services adaptés. Mentions légales.
 

GuppY, le CMS de référence sans base de données

telecharger01.png

Vous êtes ici :   Accueil » Forum » Guppy 5 » Signaler une nouveauté sur des pavés images Hover effects
 
Prévisualiser...  Imprimer...  Imprimer la page...
Prévisualiser...  Imprimer...  Imprimer la section...

Attention : GuppY 5.02.09, mise à jour des zips

Sortie de GuppY 5.02.09 :

Les zips du pack, du patch cumulatif et du patch non-cumulatif sont mis à jour au 07.06.2019 à 18h30 avec la correction du fil d' ariane pour les articles, la correction de l'affichage des archives des nouvelles, la correction du lien du logo dans le mail pour l'inscription des membres.

Si vous avez patché votre site avant le 07.06.2019 à 18h30, vous devez télécharger le patch non-cumulatif à nouveau et le réinstaller avec la fonction Installer.

Désolé, toutes nos excuses pour ce contretemps, tous nos remerciements pour les signalements.

Le patch CKEditor v4121 pour GuppY 502xx (06.07.2019) est en téléchargement dans la rubrique Télécharger puis GuppY 5. Merci à Saxbar pour cette mise à jour.

Modification du Pack GuppY 5.02.09 à la date du 20.08.2019 à 18:00:00

Mise à jour des listes de blocage des spams (24.09.2019)
pour Apache 2.3 et pour Apache 2.4 en téléchargement dans la rubrique Télécharger puis GuppY 5

Forum - Guppy 5 - Signaler une nouveauté sur des pavés images Hover effects



le 07/11/2019 @ 16:56
par Aramise

Aramise

12 messages

Bonjour à tous

j'utilise sur la page d'accueil de notre site des pavés d'image avec un effet de retournement au survol sur un texte (Hover effect repris sur le site de Jean-Denis (inspiré par tympanus.net)

Quelques unes de ces images sont sujettes à des mises à jour régulières dans le contenu de leur verso et j'aimerai donc pouvoir signaler à nos lecteurs qu'il y a une nouveauté d'info derrière l'image.

la première solution est sans doute d'incruster une icone du genre "New", mais un peu pénible à gérer au quotidien !

l'autre serait d'ajouter dans le code CSS un effet quelconque (tremblement de l'image ? ou autre). D'où peut-être une simple ligne à intégrer dans le code CSS ...

Mais je suis ne suis pas compétent pour trouver cette ligne magique !

Avez vous des idées ?

Merci d'avance

Jacques

Site web Aramise
sujet clos Haut  
Réponse n° 1
--------
le 08/11/2019 @ 06:42
par JeanDenis

JeanDenis

1407 messages

Bonjour Jacques,

Il me semble, a priori, qu'en effet, la solution la moins coûteuse en temps et en manipulations soit d'incruster une image "new" dans l'image front-img du procédé et de la renvoyer par FTP ou par l'intermédiaire de l'admin de GuppY. Cela ne devrait pas te prendre plus de deux minutes en tout...

Je chercherai cependant, s'il est simple de modifier le code afin de superposer une autre image sur l'image front-img...

Ceci étant dit... l'usage ici, veut que l'on adresse ce genre de demande directement sur le forum concerné... C'est déjà le cas pour les skins, les plugins...

Pour les astuces que je décortique (en indiquant toujours leur provenance, comme tu l'as signalé), auxquelles j'apporte très souvent des modifications et que je mets à disposition, rendez-vous donc sur le forum de mon site :

http://www.71site.fr/

Cordialement,

Jean-Denis


www.71site.fr

Site web JeanDenis
clos par Aramise le 08/11/2019 @ 16:17 Haut  
Réponse n° 2
--------
le 08/11/2019 @ 09:39
par JeanDenis

JeanDenis

1408 messages

Re,

Une solution "assez simple" peut être apportée :

ton code actuel est celui-là (par exemple) :

<div class="view view-first"><img id="front-img" src="img/accueil/Pave-AMS_350x350.jpg" />
....
</div>

modifie-le ainsi

<div class="view view-first"><span style="position: absolute; top:0px; left:0px;"><img id="front-img" src="img/accueil/Pave-AMS_350x350.jpg" /></span>
....
</div>

il n'y aura pas d'incidence sur le fonctionnement général...

et si tu souhaites ajouter une imagette de nouveauté ajoute simplement une balise span supplémentaire ainsi (en ajustant le nom, le chemin de l'image et sa position) :

<div class="view view-first"><span style="position: absolute; top:0px; left:0px;"><img id="front-img" src="img/accueil/Pave-AMS_350x350.jpg" /></span>
<span style="position: absolute; bottom:10px; right:10px;"><img id="front-img" src="img/accueil/new.gif" /></span>
....
</div>

ici, elle est placée en bas à droite à 10px du bord et elle subit (grâce à son id="front-img") la même transformation que l'image principale.

Je te remercie de m'avoir fait chercher cette astuce wink, et je complèterai le tutoriel pour en faire profiter, d'autres utilisateurs.

Rappel : Poster sur le forum de mon site http://www.71site.fr/ évite d'encombrer inutilement ce forum, réservé plutôt au fonctionnement de GuppY. Merci smile.

Bien cordialement,

Jean-Denis


www.71site.fr


Rectifié par JeanDenis le 08/11/2019 @ 09:41
Rectifié par JeanDenis le 08/11/2019 @ 09:43
Site web JeanDenis
clos par Aramise le 08/11/2019 @ 16:17 Haut  
Réponse n° 3
--------
le 08/11/2019 @ 12:18
par Aramise

Aramise

13 messages

Merci Jean-Denis

pas encore testé ta solution, mais j'imagine que ça va bien aller comme d'hab

de mon coté, j'ai trouvé une solution via la superposition d'un texte qui "clignote" via une animation sur l'opacité. Je vais le mettre sur ton forum

Et désolé pour le mauvais choix de forum !

Bonne journée

Jacques

Site web Aramise
clos par Aramise le 08/11/2019 @ 16:17 Haut  
actif sujet actif   clos sujet clos   Important! Important!   Nouveau Nouveau message
Rectifier Rectifier message   Clôturer Clôturer sujet   Remonter Remonter  



Vous êtes ici :   Accueil » Forum » Guppy 5 » Signaler une nouveauté sur des pavés images Hover effects
 
Prévisualiser...  Imprimer...  Imprimer la page...
Prévisualiser...  Imprimer...  Imprimer la section...

Préférences


Se reconnecter :
Votre nom (ou pseudo) :
Votre mot de passe
<O>


  14159159 visiteurs
  16 visiteurs en ligne

Connectés :
membressorg30
membresanne_b64
membresJeandePeyrat (GT)

Newsletter

Pour avoir des nouvelles de ce site, inscrivez-vous à notre Newsletter.

Avant de soumettre ce formulaire, veuillez lire et accepter les Mentions légales.

J'accepte :
Recopier le code :
Site enregistré à la CNIL sous l'agrément 1040387.
Vous disposez d'un droit d'accès, de modification, de rectification
et de suppression des données selon la loi Informatique et Liberté (article 34) du 6 janvier 1978.

 
FreeGuppY.org est hébergé sur un serveur dédié o2switch
gy_twitter02.png