Forum d'entraide PHPFrance

Bonjour,

J'aimerai savoir comment faire pour que le navigateur se centre sur un objet (en l'occurence une aire d'un map)

J'ai essayé de mettre avec des calques une ancre sur chaque aire et le navigateur ce déplace, mais le problème, c'est que ca donne des résultat très imprévisibles, et souvent, la zone recherchée est dans un coin...

Je dois sans doute faire quelque chose avec OnLoad, mais quoi, je n'en sais rien...

Bonjour,

Tu n'aurai pas un exemple précis d'utilisation ou un schéma de ce que tu veux faire?

D'après ce que j'ai compris la meilleure solution est de raisonnée à l'envers à savoir qu'il faut que tu centres ton objet au milieu de la fenêtre du navigateur.

J'ai une carte avec des villes dessus, et j'aimerai que lorsqu'on envoie un identifiant de ville (par un formulaire), le nvagateur se centre sur la ville correspondante.

Ok, bah c'est effectivement l'inverse qu'il faut faire c'est à dire positionner ta carte pour que la ville voulue soit au milieu de la fenêtre du navigateur.

Tu auras besoin de javascript notamment de window.width et window.height pour récupérer la hauteur et largeur de la fenêtre du navigateur de ton visiteur...

Merci.
J'ai cherché du coté du coté de l'objet window et j'ai trouvé la méthode moveto.

J'ai donc fait ce script

Code : Tout sélectionner

<script language="javascript">
function depart(x,y)
	{var height=window.height;
	var width=window.height;
	moveTo(x-width/2,y-width/2);}
</script>
<body onLoad="depart(1627,1393);">
<map name="carte">
<area shape="rect" href="deplacer.php?a=241" coords="1627,1393,1641,1410" />
</map>
<img src="cartefrance1.jpg" usemap="#carte">

Mais il marche pas...

Mais il marche pas...

Ca c'est parce qu'il a pas de jambe... et sinon, il te fais un message d'erreur ? il te place pas à l'endroit attendu ?

Ceci dit, moveTo déplace la fenêtre, et je doute que de déplacer la fenêtre puisse en centrer le contenu.... utilise plutôt window.scroll() pour définir la position à laquelle tu veux déplacer les ascenseurs pour centrer ton contenu

Ca fait une espece de vibration. La fenetre commence à se déplacer mais elle revient à ca place.

Merci pour la méthode, je débute en Javascript, donc je suis un peu perdu avec toutes les methodes et propriétés

EDIT avec scrollto, je n'ai carrement rien...

Bon, maintenant, avec ce code ca fonctionne

Code : Tout sélectionner

<script language="javascript">
function depart(x,y)
	{var height=window.height;
	var width=window.width;
	window.scrollTo(x,y);}
</script>
<body onLoad="depart(1627,1393);">
<map name="carte">
<area shape="rect" href="deplacer.php?a=241" coords="1627,1393,1641,1410" />
</map>
<img src="cartefrance1.jpg" usemap="#carte">

le problème, c'est que quand je teste les variables height et width par un alerte, ca me donne undefined.

Ben en fait, la taille de la fenêtre incluant les barres d'outil et autre, ne te sera pas vraiment d'une grande utilité... mieux vaut récupérer la taille effective de la zone d'affichage : window.innerHeight/innerWidth ou document.body.clientHeight/clientWidth (ie)

Merci.

EN fait, l'erreur était que la définition de l'ecran n'est pas window.height et window.width mais window.screen.height et window.screen.width

Oki.. ceci dit je maintiens, que la taille de l'écran ne te donne pas la même indication que la taille de la zone d'affichage du navigateur. Si le browser contient des onglets, une barre de favoris, etc. ou même tout simplement s'il n'est pas en plein écran, l'information sera erronnée

Modération :
orgerix, si ta question est résolue, pense à ajouter le tag [Résolu]
pour indiquer aux personnes qui voudront consulter ce sujet qu'il contient une solution

Et j'ai fait les modifs conseillé.

Cepndant, est ce que document.body.clientHeight/clientWidth est supporté par tous les navigateurs ? J'ai essayé avec Mozilla et IE, mais je n'en ai pas d'autres. (Et non, j'ai pas encore eu toutes mes réponses

)

Forum d'entraide PHPFrance

Centrer le navigateur sur un objet

Centrer le navigateur sur un objet