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 ...
Code HTML :
<!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>
<body>
<div id="cnt"><img id="imm" src="imagePanoramique.jpg"></div>
<script type="text/javascript">
var dx=0;
function deplc(){
dx++;document.getElementById('imm').style.left=-dx+'px';
setTimeout(deplc,7);
}
deplc();
</script>
</body>
</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...