carte interactive compatible IE6 avec JQuery

**igotzepower** · 14/05/2012, 12h10

Bonjour,

Je suis entrain de réaliser une carte interactive en jQuery. Elle fonctionne très bien sur tous les derniers navigateurs. Mais la carte doit être compatible avec IE6...
J'ai modifié tous mes img.png en gif mais les images n'apparaissent pas lorsque je passe la souris sur la carte.

Je ne sais pas d'où peut venir le pb...

D'avance je vous remercie

**headmax** · 15/05/2012, 00h06

Ce n'est pas un problème javascript que tu as, mais un problème du à la non gestion du format image png par IE6 uniquement du fait qu'il existait avant png.

Bref il y à la parade et l'utilisation d'un plugin htc te permettant de gérer la transparence de tes png.

Sinon le plus simple et d'utiliser les plugins filter css pour qui son propre a IE

CSS
(styles.css)

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
 
#id_img{
	width: 20px;
	height: 20px;
	background: url(images/image.png) no-repeat left top;
}

(styles-ie6.css)

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
#id_img{
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/image.png', sizingMethod='scale');
}

page index

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
 
<html>
<head>
<link rel="stylesheet" href="styles.css" type="text/css" />
 
<!--[if lte IE 6]>
<link href="styles-ie6.css" rel="stylesheet" type="text/css"></link>
 < ![endif]-->
</head>
<body>
<img id="id_img" src="img_effet.png"/>
</body>
</html>

Si tu l'a bien compris, ici on passe l'id "id_img" au tag <img> pour que notre style puisse gérer la transparence du png et afficher son image png.
On aurait pu créer une class CSS...

Bonne chance

.

**igotzepower** · 15/05/2012, 10h34

justement afin de gérer la transparence j'ai converti mes images en gif et ça fonctionne mais le lorsque je passe la souris sur les zones prédéfini en mapping l'image n'apparait pas ...

Es-tu sûr que ce n'est pas du à un pb en jQuery ?

carte interactive compatible IE6 avec JQuery

jQuery

Discussions similaires

Partager

Partager