Centrer un diaporama

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Centrer un diaporama

Message par Shagooo le Jeu 30 Avr 2015 - 15:27

Détails techniques


Version du forum : phpBB2
Poste occupé : Administrateur
Navigateur(s) concerné(s) : Google Chrome
Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : http://www.fsx-france.com/

Description du problème

Bonjour à tous,

J'ai un souci avec le code pour créer un diaporama (images défilantes) proposé sur le site par Vivi en mars dernier.
http://forum.forumactif.com/t377148-creer-un-diaporama-images-defilantes


Le code fonctionne bien, mais je n'arrive pas à "centrer l'image" dans un Widgets.

Le code:
Spoiler:
<style type="text/css">#rotator1430396454288 {height:275px;} #rotator1430396454288 a{position:absolute;background:#FFFFFF;border:1px solid #CCCCCC;padding:4px;} #rotator1430396454288 img { height:265px;width:500px; }</style><div id="rotator1430396454288"><a id="itemActif1430396454288" style="z-index:999" href="http://www.fsx-france.com/" title="" target="_blank"><img src="http://img11.hostingpics.net/pics/147702127.jpg" alt="" /></a><a href="http://www.fsx-france.com/" title="" target="_blank"><img src="http://img11.hostingpics.net/pics/858065439.jpg" alt="" /></a><a href="http://www.fsx-france.com/" title="" target="_blank"><img src="http://img11.hostingpics.net/pics/2822774612.jpg" alt="" /></a><a href="http://www.fsx-france.com/" title="" target="_blank"><img src="http://img11.hostingpics.net/pics/135326carte10.jpg" alt="" /></a><a href="http://www.fsx-france.com/" title="" target="_blank"><img src="http://img11.hostingpics.net/pics/7408737811.jpg" alt="" /></a><a href="http://www.fsx-france.com/" title="" target="_blank"><img src="http://img11.hostingpics.net/pics/601461crash10.jpg" alt="" /></a><a href="http://www.fsx-france.com/" title="" target="_blank"><img src="http://img11.hostingpics.net/pics/480524310432201429175411938.jpg" alt="" /></a></div><script type="text/javascript">(function(){var r = document.getElementById("rotator1430396454288"), l = r.getElementsByTagName("A"), rotate = window.setInterval(function() {var a = document.getElementById("itemActif1430396454288"), n = jQuery(a).next()[0] || l[0]; if (!a) return window.clearInterval(rotate); n.style.opacity = 1;n.style.zIndex = 998;jQuery(a).animate({"opacity":0},800,"linear",function() {a.id = "";a.style.zIndex = "";n.id = "itemActif1430396454288";n.style.zIndex = 999})},3500)})();</script>

Merci de votre aide.

Cordialement.

Shag


PS: Oups ::betise:: J'ai posté au mauvaise endroit .. Désolé Exclamation


Dernière édition par Shagooo le Jeu 7 Mai 2015 - 10:50, édité 1 fois

Shagooo
***

Masculin
Messages : 109
Inscrit(e) le : 12/09/2011

http://www.fsx-france.com/
Shagooo a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Centrer un diaporama

Message par FANCH 56 le Jeu 30 Avr 2015 - 17:37

Bonsoir

Essaie de changer la première partie de ton code par :
Code:

<style type="text/css">#rotator1427475840820 {height:130px;} #rotator1427475840820 a{position:absolute;margin-left: 5%;background:#FFFFFF;border:1px solid #CCCCCC;padding:4px;} #rotator1427475840820 img { height:110px;width:150px; }</style>             
<div id="rotator1427475840820">

FANCH 56
+ Hyperactif +

Masculin
Messages : 13260
Inscrit(e) le : 25/07/2005

http://www.anciens-cols-bleus.net/
FANCH 56 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Centrer un diaporama

Message par Shagooo le Jeu 30 Avr 2015 - 18:44

Bonsoir Very Happy

Merci, mais toujours pas centré.

Je vois que tu as inséré une marge dans ton script, le hic c'est que suivant l'écran que tu utilises, l'image sera placé différemment.

Merci tout de même.

Cordialement.

Shag

Shagooo
***

Masculin
Messages : 109
Inscrit(e) le : 12/09/2011

http://www.fsx-france.com/
Shagooo a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Centrer un diaporama

Message par FANCH 56 le Jeu 30 Avr 2015 - 20:12

Le script fonctionne tel quel, je l'ai mis sur mon portail. Voir mon forum dans mon profil.

FANCH 56
+ Hyperactif +

Masculin
Messages : 13260
Inscrit(e) le : 25/07/2005

http://www.anciens-cols-bleus.net/
FANCH 56 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Centrer un diaporama

Message par Shagooo le Ven 1 Mai 2015 - 9:11

@FANCH 56 a écrit:Le script fonctionne tel quel, je l'ai mis sur mon portail. Voir mon forum dans mon profil.

Bonjour,

Merci pour ton aide, seulement l'image n'est pas centré (ni chez moi, ni chez toi).

Je vais chercher encore et encore.

Grand merci d'avoir essayé de m'aider.

Cordialement.

Shag


Shagooo
***

Masculin
Messages : 109
Inscrit(e) le : 12/09/2011

http://www.fsx-france.com/
Shagooo a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Centrer un diaporama

Message par FANCH 56 le Ven 1 Mai 2015 - 10:28

J'ai trouvé !

Il faut que tu définisse la largeur de tes photos en fonction de la largeur de ton widget.

Chez moi, j'ai diminué de 10 px la largeur du widget, et c'est bon. Donc le prochain, je ferais en sorte de mettre une largeur correcte à mes photos dans le générateur.

FANCH 56
+ Hyperactif +

Masculin
Messages : 13260
Inscrit(e) le : 25/07/2005

http://www.anciens-cols-bleus.net/
FANCH 56 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Centrer un diaporama

Message par Shagooo le Ven 1 Mai 2015 - 14:16

Encore merci à toi pour ces précisions.

Après des heures à me gratter la tête, je dirais que ce code ne me convient pas car il n'est pas très confortable.

Je m'explique, l'image passe au dessus des autres scripts et cela pose problème au niveau affichage. J'ai vu des différences suivants les tailles d'écrans utilisés.

Vraiment dommage, car le rendu est vraiment propre.

Excellente journée à toi.

Cordialement.

Shag

Shagooo
***

Masculin
Messages : 109
Inscrit(e) le : 12/09/2011

http://www.fsx-france.com/
Shagooo a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Centrer un diaporama

Message par FANCH 56 le Ven 1 Mai 2015 - 17:41

l'image passe au dessus des autres scripts
Je ne comprends pas cette phrase.

Je n' ai eu aucun retour concernant des chevauchements.

FANCH 56
+ Hyperactif +

Masculin
Messages : 13260
Inscrit(e) le : 25/07/2005

http://www.anciens-cols-bleus.net/
FANCH 56 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Centrer un diaporama

Message par Shagooo le Ven 1 Mai 2015 - 18:21

@FANCH 56 a écrit:
l'image passe au dessus des autres scripts
Je ne comprends pas cette phrase.

Je n' ai eu aucun retour concernant des chevauchements.

Bonsoir,

Je suis très pris ce soir et demain boulot ...

Je me ferais un plaisir d'en rediscuter avec toi rapidement sur le forum ou skype.

A très vite ok

Shagooo
***

Masculin
Messages : 109
Inscrit(e) le : 12/09/2011

http://www.fsx-france.com/
Shagooo a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Centrer un diaporama

Message par MlleAlys le Mar 5 Mai 2015 - 21:51

Bonjour,
remplacez votre code par celui là :
Code:
<style type="text/css">#rotator1430396454288 {height:275px;position:relative;} #rotator1430396454288 a{position:absolute;top:0;left:100px;background:#FFFFFF;border:1px solid #CCCCCC;padding:4px;} #rotator1430396454288 img { height:265px;width:500px; }</style>
<div id="rotator1430396454288">
     <a target="_blank" title="" href="http://www.fsx-france.com/" style="z-index:999" id="itemActif1430396454288"><img alt="" src="http://img11.hostingpics.net/pics/147702127.jpg" /></a><a target="_blank" title="" href="http://www.fsx-france.com/"><img alt="" src="http://img11.hostingpics.net/pics/858065439.jpg" /></a><a target="_blank" title="" href="http://www.fsx-france.com/"><img alt="" src="http://img11.hostingpics.net/pics/2822774612.jpg" /></a><a target="_blank" title="" href="http://www.fsx-france.com/"><img alt="" src="http://img11.hostingpics.net/pics/135326carte10.jpg" /></a><a target="_blank" title="" href="http://www.fsx-france.com/"><img alt="" src="http://img11.hostingpics.net/pics/7408737811.jpg" /></a><a target="_blank" title="" href="http://www.fsx-france.com/"><img alt="" src="http://img11.hostingpics.net/pics/601461crash10.jpg" /></a><a target="_blank" title="" href="http://www.fsx-france.com/"><img alt="" src="http://img11.hostingpics.net/pics/480524310432201429175411938.jpg" /></a>
</div><script type="text/javascript">(function(){var r = document.getElementById("rotator1430396454288"), l = r.getElementsByTagName("A"), rotate = window.setInterval(function() {var a = document.getElementById("itemActif1430396454288"), n = jQuery(a).next()[0] || l[0]; if (!a) return window.clearInterval(rotate); n.style.opacity = 1;n.style.zIndex = 998;jQuery(a).animate({"opacity":0},800,"linear",function() {a.id = "";a.style.zIndex = "";n.id = "itemActif1430396454288";n.style.zIndex = 999})},3500)})();</script>
C'est le même, sauf que j'ai ajouté quelques styles au début, localisez left:100px; et modifiez cette valeur pour décaler votre image vers la gauche ou vers la droite jusqu'à centrer l'élément. ^^

MlleAlys
+ Hyperactif +

Messages : 4340
Inscrit(e) le : 12/09/2012

MlleAlys a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Centrer un diaporama

Message par Shagooo le Jeu 7 Mai 2015 - 9:06

Bonjour,

Merci beaucoup pour le complément.

Excellente journée à tous les deux.

Cordialement.

Shag


Shagooo
***

Masculin
Messages : 109
Inscrit(e) le : 12/09/2011

http://www.fsx-france.com/
Shagooo a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum