18041 sujets

Questions générales et questions de débutants

Comment supprimer les marges intérieures des popup - un casse-tête

Bonjour,

Voilà tout est dans le titre mais c'est un sacré casse-tête depuis hier.
Il n'y a que Safari outre son design affiche bien les images en popup sans marges mais IE6 et Firefox 2 outre le fait que se soit gris font d'office des marges
En effet je n'ai pas de connaissance en JS, juste les évènements.

Voici ce que j'entre d'habitude dans les liens comme la plupart :

<a href="image/stand2b.png" target="wclose" onclick="window.open('image/stand2b.png','wclose','width=500,height=335,toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=no,resizable=no,copyhistory=no,left=150,top=25')"><img src="image/stand2.png" alt="stand2" height="153" width="230" /></a>


Je pensais rajouter
<a href="image/stand2b.png" target="wclose" onclick="window.open('image/stand2b.png','wclose','width=500,height=335,[b]margin=0,paddging=0,[/b]toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=no,resizable=no,copyhistory=no,left=150,top=25')"><img src="image/stand2.png" alt="stand2" height="153" width="230" /></a>


Mais malheureusement cela ne fonctionne pas Smiley confus

J'ai donc recherché sur le web une solution et j'ai trouvé ceci qui date de 2004 - d'après ce que j'ai pu comprendre on crée une fenêtre popup avec une entête et un corps de page ensuite on affiche l'image dans le corps sans marges ensuite on clique pour fermer la popup
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
	<title>Démo popup by HackTrack</title>
	<script>
		var popup = null;
		
		function buildReactiveImages(){
			images = document.getElementsByName('reactImg');
			for(i=0 ; i<images.length ; i++){
				images[i].onclick=openPopup;
			}
		}
		
		function openPopup(){
			if(popup==null){
				popup=window.open('','','status=no,scrollbar=no,menubar=no');
			}
			tempImg = new Image();
			tempImg.src = this.src;
			popup.resizeTo(tempImg.width, tempImg.height);
			popupHTML  = "<html>";
			popupHTML += "	<head>";
			popupHTML += "		<style>";
			popupHTML += "			body{";
			popupHTML += "				margin: 0 0 0 0;";
			popupHTML += "				padding: 0 0 0 0;";							
			popupHTML += "			}";						
			popupHTML += "		</style>";							
			popupHTML += "	</head>";			
			popupHTML += "	<body>";
			popupHTML += "<img src='"+this.src+"' onclick='opener.closePopup();'/>";
			popupHTML += "	</body>";						
			popupHTML += "</html>";			
			
			popup.document.write(popupHTML);
		}
		
		function closePopup(){
			if(popup){
				popup.close();
				popup=null;
			}
		}
	</script>
</head>

<body onload="buildReactiveImages();">

	<img name="reactImg" src="http://www.commentcamarche.net/images/logotop.gif" />

</body>
</html>


Seulement le problème c'est que d'après l'exemple l'image s'affiche bien sans marges mais la fenêtre mange 1/4 de l'image à l'affichage Smiley ohwell

Merci pour la solution à rectifier du JS[/i]
Modifié par Gil88 (09 Sep 2008 - 17:55)
Voilà j'ai trouvé une solution sans JS qui ne résoud pas la réponse du haut !!!
Elle est ce qu'elle est ma foi j'utilise toujours l'évènement onclick mais en pointant simplement sur une page html comme pour une vidéo au lieu d'une image c'est plus propre et plus de problème de marge avec mon fichier style.css et je n'ai pas trouvé d'autres moyens sans connaissance JS.
Je sais que c'est plus lourd mais en faisant des essais moi cela s'affiche très vite sur les 3 navigateurs.
Modifié par Gil88 (10 Sep 2008 - 11:55)
Sujet clos
Aller à