[Probleme avec IE] photoshop et les tranches

arsenik360

4 Janvier 2011 15:54:50

Bonjour !

J'ai crée un page web avec photoshop. J'ai utilisé plusieurs tranches pour pouvoir faire un menu avec gestion souris (onmouseover, onmouseout).
Sous firefox, ça fonctionne nickel mais par contre sous explorer j'ai des soucis, les tranches laisse des ligne blanches un peu partout

Une idée pour remédier à ca ?

Merci

Arsenik

Autres pages sur : probleme photoshop tranches

| Etre averti des réponses
| Alerter

Répondre à arsenik360

mpat5

4 Janvier 2011 17:49:58

Ce sujet a été déplacé de la catégorie Graphisme vers la catégorie Programmation par Mpat5

| Alerter

Répondre à mpat5

OmaR

Expert Programmation

4 Janvier 2011 19:49:22

Salut,

C'est certainement un problème de margin.
Mais sans code, on ne pourra pas t'en dire plus

| Alerter

Répondre à OmaR

arsenik360

4 Janvier 2011 21:51:59

le voici

<html>
<head>
<title>5YMED_Geoffroy</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<!-- Save for Web Slices (5YMED_Geoffroy.psd) -->
<table id="Tableau_01" width="1025" height="769" border="0" cellpadding="0" cellspacing="0">
	<tr>
		<td colspan="10">
			<img src="images/5YMED_Geoffroy_01.jpg" width="1024" height="75" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="1" height="75" alt=""></td>
	</tr>
	<tr>
		<td colspan="4">
			<img src="images/5YMED_Geoffroy_02.jpg" width="234" height="4" alt=""></td>
		<td colspan="3" rowspan="2">
 
 
		<!--  MODIFICATION BOUTON 1 !-->
 
 
			<img	
		src="images/5YMED_Geoffroy_03.jpg"
		name="bouton1"
		alt=""
		onmouseover="bouton1.src='images/5YMED_Geoffroy_03 (2).jpg' "
		onmouseout="bouton1.src='images/5YMED_Geoffroy_03.jpg' " />
</td>
		<td colspan="3" rowspan="4">
			<img src="images/5YMED_Geoffroy_04.jpg" width="645" height="64" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="1" height="4" alt=""></td>
	</tr>
	<tr>
		<td colspan="2" rowspan="3">
			<img src="images/5YMED_Geoffroy_05.jpg" width="62" height="60" alt=""></td>
		<td rowspan="2">
 
 
		<!--  MODIFICATION BOUTON 2 !-->
 
 
			<img	
				src="images/5YMED_Geoffroy_06.jpg"
				name="bouton2"
				alt=""
				onmouseover="bouton2.src='images/5YMED_Geoffroy_06 (2).jpg' "
				onmouseout="bouton2.src='images/5YMED_Geoffroy_06.jpg' " /></td>
		<td rowspan="7">
			<img src="images/5YMED_Geoffroy_07.jpg" width="27" height="689" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="1" height="37" alt=""></td>
	</tr>
	<tr>
		<td colspan="3" rowspan="2">
			<img src="images/5YMED_Geoffroy_08.jpg" width="145" height="23" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="1" height="5" alt=""></td>
	</tr>
	<tr>
		<td>
			<img src="images/5YMED_Geoffroy_09.jpg" width="145" height="18" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="1" height="18" alt=""></td>
	</tr>
	<tr>
		<td rowspan="4">
			<img src="images/5YMED_Geoffroy_10.jpg" width="61" height="629" alt=""></td>
		<td colspan="2">
 
 
		<!--  MODIFICATION BOUTON 3 !-->
 
 
			<img	
				src="images/5YMED_Geoffroy_11.jpg"
				name="bouton3"
				alt=""
				onmouseover="bouton3.src='images/5YMED_Geoffroy_11 (2).jpg' "
				onmouseout="bouton3.src='images/5YMED_Geoffroy_11.jpg' " /></td>
		<td rowspan="4">
			<img src="images/5YMED_Geoffroy_12.jpg" width="3" height="629" alt=""></td>
		<td colspan="3">
 
 
		<!--  MODIFICATION BOUTON 4 !-->
 
 
			<img	
				src="images/5YMED_Geoffroy_13.jpg"
				name="bouton4"
				alt=""
				onmouseover="bouton4.src='images/5YMED_Geoffroy_13 (2).jpg' "
				onmouseout="bouton4.src='images/5YMED_Geoffroy_13.jpg' " /></td>
		<td colspan="2" rowspan="2">
			<img src="images/5YMED_Geoffroy_14.jpg" width="642" height="94" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="1" height="42" alt=""></td>
	</tr>
	<tr>
		<td colspan="2" rowspan="3">
			<img src="images/5YMED_Geoffroy_15.jpg" width="146" height="587" alt=""></td>
		<td colspan="3">
			<img src="images/5YMED_Geoffroy_16.jpg" width="145" height="52" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="1" height="52" alt=""></td>
	</tr>
	<tr>
		<td rowspan="2">
			<img src="images/5YMED_Geoffroy_17.jpg" width="115" height="535" alt=""></td>
		<td colspan="3">
 
 
		<!-- MODIFICATION VIDEO !-->
 
 
			<video width=640 height=512 controls>
				<source src="video/5YMED_Geoffroy_video.mp4" type="video/mp4" />
				<source src="video/5YMED_Geoffroy_video.theora.ogv" type="video/ogg" />
 
			</video>
</td>
		<td rowspan="2">
			<img src="images/5YMED_Geoffroy_19.jpg" width="32" height="535" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="1" height="512" alt=""></td>
	</tr>
	<tr>
		<td colspan="3">
			<img src="images/5YMED_Geoffroy_20.jpg" width="640" height="23" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="1" height="23" alt=""></td>
	</tr>
	<tr>
		<td>
			<img src="images/spacer.gif" width="61" height="1" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="1" height="1" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="145" height="1" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="27" height="1" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="3" height="1" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="115" height="1" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="27" height="1" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="3" height="1" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="610" height="1" alt=""></td>
		<td>
			<img src="images/spacer.gif" width="32" height="1" alt=""></td>
		<td></td>
	</tr>
</table>
<!-- End Save for Web Slices -->
</body>
</html>

j'ai un autre "soucis", la video en mp4, codec h264, ne s'affiche pas non plus sur Safari

normalement, elle devrait s'affiche, sachant que le codec est sensé etre supporté non ?

merci

| Alerter

Répondre à arsenik360

OmaR

Expert Programmation

4 Janvier 2011 23:24:12

Hmm, vu qu'on a aucune image, c'est difficile de voir exactement ce que ça donne.
Tu pourrais pas uploader ta page avec toutes les images quelque part, qu'on voit directement à quoi ça ressemble, ça sera plus pratique pour l'éditer

| Alerter

Répondre à OmaR

arsenik360

4 Janvier 2011 23:39:34

Bien sur,

Au niveau des 4 boutons de menu, il y a deux lignes blanche et sous 2 boutons, idem.
(Ne pas faire attention au gros carré blanc plus bas, c'est un emplacement de video

)

| Alerter

Répondre à arsenik360

OmaR

Expert Programmation

5 Janvier 2011 08:33:45

En fait, je disais de mettre tout le fichier HTML avec les images sur internet, pas de faire un screenshot.
Mais ça doit être dû à la taille de tes images "calendrier" & "mes cadeaux", dans la source, tu ne spécifies pas leur taille, du coup, ça doit aider à ce que le tableau se perde.

| Alerter

Répondre à OmaR

arsenik360

5 Janvier 2011 09:57:54

non malheureusement ce n'est pas ça non plus

je viens d'ajouter les width et height, c'est la mm chose

je vx bien le mettre en ligne, tu connais un hebergeur qui vaux le coup ?

| Alerter

Répondre à arsenik360

OmaR

Expert Programmation

5 Janvier 2011 10:34:16

désolé, je ne connais pas trop d'hébergeur gratuit.
sinon tu peux faire un zip et l'envoyer sur un service de stockage (rapidshare, megaupload...)

| Alerter

Répondre à OmaR

arsenik360

5 Janvier 2011 17:09:52

Voila enfin l'url

http://arsenik360.byethost8.com/

| Alerter

Répondre à arsenik360

OmaR

Expert Programmation

5 Janvier 2011 21:13:40

C'est découpé super bizarrement.

Calendrier n'est pas sur la même ligne que Mes Cadeaux.

Mes Cadeaux fait 41px de haut, alors que les autres font 42px

...

Franchement, ce découpage est assez pourri, j'imagine que c'est Photoshop qui t'a fait ça tout seul ?

Perso, ce que j'aurais fait, ça aurait été une seule image de fond avec ton père noel, ton chalet, ton bonhomme de neige et les montagnes...
Cette image, je l'aurais mise en background d'une div.
Et après 4 petites images "Calendrier", "Mes Cadeaux", "Météo" et "Contact", que j'aurais placé comme je veux dans cette div. (avec la possibilité d'avoir une petite image avec l'effet de neige et fond transparent que tu mets au dessus de chacune de tes 4 sections)

Là le soucis, c'est que si tu veux ajouter une 5ème section, tu dois recommencer tout ton découpage

| Alerter

Répondre à OmaR

arsenik360

5 Janvier 2011 21:24:51

C'est que c'est un travail de cours, j'ai des consignes strictes
Je dois faire un montage photoshop avec des tranches (pour y placer la video et le menu) et l'enregistrer pour le web (page html) d'ou le découpage, qui je te l'accorde est complètement spécial.

Sinon je suis tout a fait d'accord que les div auraient été la meilleur manière

Je vais laisser ça, de toute facon le prof vérifiera sur firefox et safari, donc voilà mais question de perfection, le bon fonctionnement sur ie aurai été sympa

Enfin, merci quand mm hein

| Alerter

Répondre à arsenik360

OmaR

Expert Programmation

6 Janvier 2011 00:00:13

Je comprend bien tes consignes, mais je vois pas ce que ça empêche ? T'es obligé d'utiliser ce que photoshop t'a donné comme fichier html ?
Surtout que l'utilisation de tableaux pour faire un site, c'est trop "années 90"

| Alerter

Répondre à OmaR

arsenik360

6 Janvier 2011 12:57:34

Non, ce n'est pas préciser.. mais c'est de cette maniere qu'on à vu ça en classe.
J'ai un autre cours ou justement l'accent est mis sur les div

autant faire comme le cours

| Alerter

Répondre à arsenik360

Tom's guide dans le monde