[AJAX] Non affichage d'un Background sous IE. Cause=Ajax?
Bonjour,
Je suis en train de développer un RPG pas navigateur et je rencontre quelques problèmes de programmation avec IE lors du déplacement sur map.
Je m'explique. Le jeu possède une Map d'environ 7000*3500px, et je n'en affiche qu'une partie d'environ 400*240 en fonction des coordonnées $_SESSION['x'] et $_SESSION['y'] du joueur.
Sur ma page il y a donc La partie de la Map avec des flèches directionnelles.
Aux flèches directionnelles j'applique onclick="DeplaceMap(\'direction\');", avec direction pouvant valoir haut, bas, gauche, ou droite.
Ma fonction DeplaceMap est c'elle ci:
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
| function DeplaceMap(orientation)
{
ajaxInit();
var url = "quete.php";
var post = "orientation="+orientation;
httpReq.onreadystatechange = resultatPostDeplaceMap;
httpReq.open('POST', url, true);
httpReq.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
httpReq.setRequestHeader("Content-length", post.length);
httpReq.setRequestHeader("Connection", "close");
httpReq.send(post);
return false;
}
function resultatPostDeplaceMap()
{
if (httpReq.readyState == 4) {
if (httpReq.status == 200) {
var resultatPostDeplaceMap = httpReq.responseText;
$("coordMapImg").style.backgroundPosition = resultatPostDeplaceMap;
} else {
alert('Un problème est survenu avec la requête.');
}
}
} |
Suite à la transmition de ma variable POST, voici mon code PHP:
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
| if (isset($_POST['orientation']))
{
session_start();
if($_POST['orientation'] == "haut")
{
$_SESSION['y'] -= 20;
}
elseif($_POST['orientation'] == "gauche")
{
$_SESSION['x'] -= 20;
}
elseif($_POST['orientation'] == "droite")
{
$_SESSION['x'] += 20;
}
elseif($_POST['orientation'] == "bas")
{
$_SESSION['y'] += 20;
}
echo '-'.$_SESSION['x'].'px -'.$_SESSION['y'].'px';
}
else
{
Affichage de ma page
} |
Et voici un bout du code de ma page en question où j'affiche la Map:
Code:
echo'<div id="coordMapImg"><img style="margin-top: 100px;margin-left: 180px;" src="image_outil/bonhomme.gif" alt="perso" /></div>';
J'y met donc l'image du personnage, et en Fond, l'image de la Map que j'ai défini lors de l'ouverture de la page mais dans mon html:
Code:
1
2
3
4
5
6
7
8
9
10
11
|
<style type="text/css">
#coordMapImg
{
height: 230px;
width: 400px;
background-image: url("Map/GrandeMap/ImmenseMapGeneralPixel.gif");
background-repeat: no-repeat;
background-position: -'.$_SESSION['x'].'px -'.$_SESSION['y'].'px;
}
</style> |
Et donc à chaque click, en fonction de la direction, je renvoi les coordonnés du joueur et modifie la position du fond avec $("coordMapImg").style.backgroundPosition = resultatPostDeplaceMap;
Ce code fonctionne donc trés bien sous Firefox, mais sous IE le fond ne s'affiche méme pas.
Merci de bien vouloir m'aider. ;)
