Défilement automatique horizontale dans une iframe
alundra405
Messages postés7Date d'inscriptiondimanche 29 octobre 2006StatutMembreDernière intervention18 février 2011
-
18 févr. 2011 à 18:35
007Julien
Messages postés276Date d'inscriptionmercredi 22 septembre 2010StatutMembreDernière intervention 8 janvier 2014
-
19 févr. 2011 à 14:29
Bonjour à tous ! Alors voilà je suis vraiment un noob en javascript et après moult recherche sur le net, je n'ai pas réussi à trouver la solution à mon problème, c'est pourquoi je me tourne vers vous qui sauraient certainement éclairer ma lanterne.
Alors voilà j'ai une iframe qui fait 100% de la fenêtre en largeur et 700px de hauteur qui contient une image qui fait 5500px de large. Cette iframe a une barre de défilement horizontale. Ce que je souhaiterai faire c'est que l'image à l'intérieur de l'iframe défile automatiquement de gauche à droite et inversement.
Voilà j'espère avoir été assez explicite. Je vous remercie par avance de l'attention que vous porterez à mon problème et vous souhaite une bonne soirée.
007Julien
Messages postés276Date d'inscriptionmercredi 22 septembre 2010StatutMembreDernière intervention 8 janvier 20144 19 févr. 2011 à 14:29
La page suivante à inclure dans l'iframe en adaptant le nom de l'image (imagePanoramique.jpg à modifier) devrait pouvoir constituer une première piste à améliorer ...
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="fr">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="generator" content="PSPad editor, www.pspad.com">
<title>Image défilante</title>
<style type="text/css">
body {margin:0px;padding:0px;}
#cnt {margin:0px;padding:0px;position:relative;}
img {display:block;position:relative;left:0px;top:0px;}
</style>
</head>
<script type="text/javascript">
var dx=0;
function deplc(){
dx++;document.getElementById('imm').style.left=-dx+'px';
setTimeout(deplc,7);
}
deplc();
</script>
</html>
La balise image doit être déclarée block (à défaut c'est un élément inline) et placée dans un container positionné.
Reste à changer le signe de dx pour inverser le sens du défilement en bout de course, ou mieux, avec un panoramique complet, trouver le moyen de boucler...