Forum - En vrac ! - Effet rollover sur mobile
le 15/12/2016 @ 17:33
par anne_b64
Bonjour
J'ai fait un essai d'effet rollover dans la boîte libre du haut sur ce site: ICI
Sur le site, j'obtiens l’effet attendu. Sur mon mobile, les image ne s'affichent qu'au tiers environ.
Qu'ai-je fait de travers?
Merci par avance.
Anne
--------
le 15/12/2016 @ 19:55
par anne_b64
Bonsoir
Heu ..... non, la boîte y est! C'est quoi ce mystère?
image ici
Anne
Rectifié par anne_b64 le 15/12/2016 @ 19:58
--------
le 16/12/2016 @ 07:53
par JeanDenis
Administrateur
Bonjour Anne,
Je viens de tester en local et en ligne et je ne reproduis pas ton souci
Regarde là :
https://tests.71site.fr/ESSAI-GY50105/articles.php?lng=fr&pg=515&mnuid=363&tconfig=0
id : visiteur
mdp : motdepasse
Je laisse un accès quelques jours (le site test est en version 5.01.06).
Il y a un article et une boite libre latérale qui contiennent le même code avec deux rollovers. En affichage ordinateur et smartphone, ça passe. Évidemment le survol, avec le smartphone, il faut cliquer, mais j'ai toutes les images.
Dans ton code, tu les as mis dans un tableau, moi dans le mien, les images sont enserrées dans des div comme ci-dessous, ceci explique peut-être cela...
<div style="margin-left:20px;">
<div id="rollover2"><img alt="agenda.png" id="second-img" src="img/Imagettes/agenda.png" /> <img alt="agenda2.png" id="first-img" src="img/Imagettes/agenda2.png" title="agenda" /></div>
</div>
<div style="margin-top:10px; clear:both;"></div>
<div style="margin-left:20px;">
<div id="rollover2"><img alt="convoc.png" id="second-img" src="img/Imagettes/convoc.png" /> <img alt="convoc2.png" id="first-img" src="img/Imagettes/convoc2.png" title="convocations" /></div>
</div>
<div style="margin-top:10px; clear:both;"></div>
--------
le 16/12/2016 @ 10:57
par anne_b64
Bonjour
Merci pour ces infos, j'ai tout refait en utilisant ton code, et voici le résultat obtenu sur mon iphone, avec plusieurs navigateurs c'est idem: capture
Est-ce un souci avec apple?
Anne
--------
le 16/12/2016 @ 11:18
par JeanDenis
Administrateur
Re,
Alors ça, c'est fort de café ! Ton site m'affiche des demi-images avec mon smartphone (android) et la simulation de Chrome, alors que mes tests fonctionnent...
Peux-tu copier-coller ton code source de la boite libre dans un fichier txt (avec notepad ++ par exemple et me l'envoyer par le contact du site. Pour les images je copie les deux dernières et je regarde...
Amicalement,
--------
le 16/12/2016 @ 14:42
par anne_b64
Bonjour
Et pour compléter mes propos, sur cet autre site: ici
En bas de site, la boîte Nos partenaires présente le même souci.
J'ai testé ces différentes boîtes sur l'ensemble de mes sites, et c'est idem.
Anne
--------
le 16/12/2016 @ 15:44
par JeanDenis
Administrateur
Re,
J'ai été un peu long... C'était à s'arracher les cheveux...
Ton code (même si ce n'est pas celui que j'aurai mis... -je mets le style au début du code et ensuite le corps... mais peu importe...) n'a rien à voir...
C'est dans ton (tes) fichiers mobstyle qu'il faut intervenir,
sur ton site https://bridge-oloron.fr/
on lit ligne 172 et suivantes
.tblbox,.tblboxover, .box, .box a {
font-size: 1em;
padding:.2em .2em 1em;
}
remplace la valeur en rouge par 0
Je ne pense pas que cela ait d'incidence par ailleurs sur l'affichage smartphone (en tout cas, sur mes skins, je n'ai pas ces valeurs...)
Teste et tiens-moi au courant...
Amicalement,
--------
le 16/12/2016 @ 17:46
par anne_b64
Bonsoir
Testé, approuvé, ça fonctionne.
J'ai fait cette modif sur 2 sites où le problème était présent (2 skins Papinou), et c'est réglé.
Par contre, sur le site avec la skn5_guppy2015, je ne trouve pas ces lignes.
J'ai ceci:
#BottomBoxes .titrebox, #BottomBoxes .titre {
margin:1em 0;
padding:1em .5em;
border:none;
}
#BottomBoxes .tblbox, #BottomBoxes .tbl {
margin:.5em 0;
padding:.5em;
border:none;
border-radius:0;
}
Merci pour ton aide.
Anne
--------
le 16/12/2016 @ 17:53
par anne_b64
Re!
Encore une petite question.
Je regarde ton site sur smartphone, les pages sont bien fixes.
Sur les miens, elles sont "mobiles" latéralement, avec le doigt, je peux les bouger à gauche et à droite, laissant ainsi apparaître le fond du site. Comment fait-on pour obtenir un site qui ne ballotte pas sur smartphone?
Je ne sais pas si mes explications sont très claires ....
Merci par avance.
Anne
--------
le 16/12/2016 @ 18:10
par JeanDenis
Administrateur
Re,
Pour ta première question, mets l'adresse du site avec la skn5_guppy2015 que je puisse voir (en tout cas ce ne sont pas ces lignes)
En affinant, dans tes deux skins précédentes, c'est comme ceci qu'il faudrait modifier (c'est la partie lien - a - qu'il faut corriger, le reste peut être maintenu)
.tblbox,.tblboxover, .box {
font-size: 1em;
padding:.2em .2em 1em;
}
.box a {
font-size: 1em;
padding:.2em 0 1em;
}
Pour ta deuxième question... hélas, je cherche encore (sans application excessive toutefois... ). Si tu regardes 71site.fr sur smartphone il "glisse" aussi latéralement de quelques pixels... Je m'en suis fait une raison -plus ou moins- ... Un jour... peut-être...
Amicalement,
--------
le 16/12/2016 @ 18:35
par anne_b64
--------
le 16/12/2016 @ 18:42
par JeanDenis
Administrateur
Re,
Ces lignes y sont à partir de la ligne 152 du fichier mobstyle :
.tblbox,.tblboxover, .box, .box a {
font-size: 1em;
padding:.5em .5em 1em;
}
Tu modifies comme cela, ça devrait aller... :
.tblbox,.tblboxover, .box {
font-size: 1em;
padding:.5em .5em 1em;
}
.box a {
font-size: 1em;
padding:.5em 0 1em;
}
Amicalement,
--------
le 16/12/2016 @ 21:26
par anne_b64
Bonsoir
C'est fait, et le problème est résolu.
Sur le site 2 (skin Papinou, les lignes se présentaient différemment.
J'ai fait ça mais je doute de l'utilité de la répétition des 2 dernières lignes.
.tblbox,.tblboxover, .box {
font-size: 1em;
padding:.2em .2em 1em;
border:none;
border-radius:0;
}
.box a {
font-size: 1em;
padding:.2em 0 1em;
border:none;
border-radius:0;
}
Bonne soirée, perso je déguste les médocs que le toubib vient de me donner, l'épisode viral est sévère ..........
--------
le 16/12/2016 @ 23:05
par JeanDenis
Administrateur
Bonsoir Anne,
Tu as bien fait de transformer comme ci-dessus, pas de souci.
Quant à la feuille de style RD mobile (mobstyle.css), elle n'est jamais modifiée par les patchs, et Config Look n'a pas d'effet sur elle. Donc pas d'inquiétude et je pense que si des modifications devaient intervenir, ce serait sous la forme d'une moulinette du type maj_configmob.php comme cela avait été fait lors du passage à GuppY5.01.00.
Soigne-toi bien, bon week-end,
Amicalement,
Rectifier message Clôturer sujet Remonter