Bild im onClick-Fenster ohne weißen Hintergrund an allen 4 Rändern anpassen!

kasamoto · 13. Juli 2004

Hallo, ich würde gern wissen, wie man ein Bild, dass sich durch "onClick" im neuen Fenster öffnet, ohne den grauenhaften weißen Hintergrund darstellen kann!

Also, wie man "toolbar=no" usw. im Script unterbringt, weiß ich inzwischen. Aber selbst wenn ich die genaue Bildgröße, z.B. width=640 und height=480 eingebe, bleibt immer am linken und oberen Rand der weiße Hintergrund sichtbar, den ich einfach störend finde!

Was muss ich nun ins Script einfügen, damit das Bild das Fenster voll ausfüllt?

Warum klappt das eigentlich problemlos bei PopUp-Fenstern? Da sind doch auch Bilder an allen 4 Rändern gleichmäßig ausgerichtet, und nicht nur am rechten und unteren Rand!

Muss man da irgendwo "topmargin" und "leftmargin" einfügen, oder doch etwas ganz anderes?

Habe leider echt keine Ahnung! Bitte, helft mir, damit ich endlich diese perfekten Fenster erzeugen kann - und nicht die üblichen _blank-Fenster, bzw. die erwähnten Weiß-Rand-Fenster!

Danke im Voraus und Ciao!
Ingo

Samuel · 13. Juli 2004

Vielleicht hilft dir das hier weiter:

PHP:

<script type="text/javascript">
	<!--
	function openWin(img) {
	fenster = open('', '', 'height=120,width=200,menubar=no,toolbar=no,directories=no,scrollbars=no,resizable=no,status=no,location=no');
	inhalt = fenster.document;
	new = '<html><body topmargin="0" leftmargin="0" marginwidth="0" marginheight="0">';
	new += '<img src="' + img + '"></body></html>';
	inhalt.open();
	inhalt.write(new);
	inhalt.close();
	}
	//-->
</script>

kasamoto · 14. Juli 2004

Hallo Samuel, nochmals Danke für den Tipp!
Aber wie in meiner Mail schon beschrieben, hat es ja leider nicht geholfen!

Mit Deinem Script konnte ich leider wegen der Syntaxfehler und anderen Störungen nichts erreichen! Das lag aber wohl eher an meinen mangelnden Javascript-Kenntnissen, da ich nicht genau wusste, was ich an welchen Stellen einfügen sollte ...- bin eben Anfänger!

Nun also, wie gewünscht den Code und einen Link zu meiner Seite mit den Eingaben, die ich bisher zustande gebracht habe!

Die folgende Seite mit dem Link habe ich nur zu Java-Testzwecken veröffentlicht!
Es gibt also sonst keinen Link auf meiner Website dorthin!
Ich will erst perfekte Javascript-Fenster ohne Rand erstellen können, bevor ich sie allen zeige!

Hier der Code, den ich eingefügt habe:

<a href="#" onClick="window.open('images/bugatti.jpg', 'BUGATTI','toolbar=no,status=no,menubar=no,width=741,height=409')">
<b><img border="0" src="images/bugatti_klein.jpg" width="74" height="40"></a>

Hier geht´s direkt zur Seite:

http://www.gifknaller.de/gifknaller_logo.htm

Danke & Ciao
Ingo

Samuel · 14. Juli 2004

PHP:

<html>
	<head>
		<script type="text/javascript">
	    function openWin(img, w, h) {
	    fenster = open('', '',  'height=' + h + ',width=' + w + ',menubar=no,toolbar=no,directories=no,scrollbars=no,resizable=no,status=no,location=no');
	    inhalt = fenster.document;
	    new = '<html><body topmargin="0" leftmargin="0" marginwidth="0" marginheight="0">';
	    new += '<img src="' + img + '"></body></html>';
	    inhalt.open();
	    inhalt.write(new);
	    inhalt.close();
	    }
		</script>
	</head>
	
	<body>
	
	<a href="#" onClick="openWin('images/bugatti.jpg', 741, 409);"><img border="0" src="images/bugatti_klein.jpg" width="74" height="40"></a>
	
	</body>
</html>

Falls dir PHP zur Verfügung steht mach das so:

PHP:

<html>
	<head>
		<script type="text/javascript">
	    function openWin(img, w, h) {
	    fenster = open('', '',  'height=' + h + ',width=' + w + ',menubar=no,toolbar=no,directories=no,scrollbars=no,resizable=no,status=no,location=no');
	    inhalt = fenster.document;
	    new = '<html><body topmargin="0" leftmargin="0" marginwidth="0" marginheight="0">';
	    new += '<img src="' + img + '"></body></html>';
	    inhalt.open();
	    inhalt.write(new);
	    inhalt.close();
	    }
		</script>
	</head>
	
	<body>
	<?php
	$imgsize = getimagesize("images/bugatti.jpg");
	?>
	<a href="#" onClick="openWin('images/bugatti.jpg', <?php echo $imgsize[1]; ?>, <?php echo $imgsize[2]; ?>);"><img border="0" src="images/bugatti_klein.jpg" width="74" height="40"></a>
	
	</body>
</html>

kasamoto · 15. Juli 2004

Hallo Samuel, und Hallo an alle, die dieses Forum besuchen!

Ich bin´s schon wieder!

Ich habe den Code eingefügt, aber ich bin einfach zu nichts gekommen, außer zu Syntaxfehlern bzw. den Hinweis "Fehler: Objekt erwartet "}" usw.!
Ich drehe wirklich langsam durch!

Du hast doch sicher selbst einmal mit irgendeinem Bild diesen Code ausprobiert, der dann auch funktionierte, sonst hättest Du ihn ja nicht empfohlen!

Es kann doch nicht an meinen Programm FrontPage liegen, denn das andere onClick-Fenster klappt doch auch - ebenso Pop-Ups, die ich schon mal auf meiner Page hatte.

Nur dieser Code will einfach nicht klappen!

Es gab einfach immer Fehlermeldungen, so dass kein Fenster angezeigt wurde - weder mit, noch ohne weißen Hintergrund!

Besonders wichtig ist für mich, zu wissen, ob ich im Script-Text überhaupt etwas eintragen oder ändern darf, wegen der anzuzeigenden Bilder!?

Vorausgesetzt, dass Script funktioniert überhaupt!

Muss ich eigentlich an den Stellen "+ img + , + h +..." noch etwas einfügen oder müssen diese Stellen als Platzhalter frei bleiben?
Ich hab´s zwar mit eigenen Eingaben versucht, nachdem es ohne nicht ging, aber auch dann ging es nicht!

Und: Gilt dieses Script für alle Bilder, die ich noch auf derselben Seite einfüge?
Ich meine, kann ich weitere Bilder mit "<a href img..." einfügen, auch wenn die Maße unterschiedlich sind! Darum meine Frage nach den Platzhaltern im Script!

Denn alle Bilder sollen schließlich ohne störende Freiräume im jeweiligen Fenster angezeigt werden, egal welche Größe sie haben!

Bleibt mir nur noch, auf weitere Hilfe zu hoffen....

Danke & Ciao
Ingo

Samuel · 15. Juli 2004

poste doch mal dein bisheriges Script
greetz

kasamoto · 15. Juli 2004

Ok, aber es ist eigentlich das, was Du mir als letztes empfohlen hast!
Nur sind bei mir die FrontPage-Daten mit drin.

Mit diesem Script werden dann allerdings auch die Fehler mitgeteilt:
Zeile:9
Zeichen:13
Fehler: Syntaxfehler
Code: 0

hier ist es also:
------------------------------

<html>
<head>
<script type="text/javascript">
function openWin(img, w, h) {
fenster = open('', '', 'height=' + h + ',width=' + w + ',menubar=no,toolbar=no,directories=no,scrollbars=no,resizable=no,status=no,location=no');
inhalt = fenster.document;
new = '<html><body topmargin="0" leftmargin="0" marginwidth="0" marginheight="0">';
new += '<img src="' + img + '"></body></html>';
inhalt.open();
inhalt.write(new);
inhalt.close();
}
</script>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title>Neue Seite 1</title>

</head>

<body>

<a href="#" onClick="openWin('images/bugatti.jpg', 741, 409);"><img border="0" src="images/bugatti_klein.jpg" width="74" height="40"></a>

</body>
</html>

---------------------
gruß & bis dann
Ingo

Freesolo · 15. Juli 2004

Hi kasamoto,

wenn alles nichts hilft, nimm' doch einfach mein Skript:

Code:

<script language="JavaScript">
<!--
if (document.images) {

  var openNewWin=false;

  var onLoadBeforeImage=null;
  var winName='neuwin';
  var ct=0;

  if (window.onload)
    onLoadBeforeImage=window.onload;

  window.onload=BildOeffnenInit;

}

function BildOeffnenInit()
{
  if (onLoadBeforeImage)
    onLoadBeforeImage();

  for (var i=0; i < document.links.length; i++) {

    var HREF = document.links[i].href.toLowerCase().split('.');
    if (HREF[HREF.length-1] == 'jpg' || HREF[HREF.length-1] == 'gif' || HREF[HREF.length-1] == 'png')
      document.links[i].onclick = OeffneBild;

  }
}

function OeffneBild()
{
  var BildName = this.href.split('.');
  var BildGroesse = BildName[BildName.length-2].split('x');

  var ModX=0, ModY=0, Dat=this.href.split('/'); Dat=Dat[Dat.length-1];
  if (!document.layers && !document.all) { ModX=20;ModY=30; }
  var breite=parseInt(BildGroesse[0])+ModX;
  var hoehe=parseInt(BildGroesse[1])+ModY;
  var Param = 'width='+breite+',height='+hoehe+',directories=0,location=0,menubar=0,resizable=0,scrollbars=0,status=0';
  if (document.layers)
    Param += ',screenX='+(screen.width/2-breite/2)+',screenY='+(screen.height/2-hoehe/2);
  else if (document.all)
    Param += ',left='+(screen.width/2-breite/2)+',top='+(screen.height/2-hoehe/2);

  if(!openNewWin)
    if (window[winName] && !window[winName].closed)
      window[winName].close();

  winName='neuwin'+(ct++);
  window[winName] = window.open('', winName, Param);

  with (window[winName].document) {
    open();
    write('<html>\n<head>\n<title>'+this.href+'</title>\n</head>\n');
    write('<body leftmargin=0 topmargin=0 marginwidth=0 marginheight=0>\n');
    write('  <a href="javascript:self.close()"><img src="'+this.href+'" width='+BildGroesse[0]+' height='+BildGroesse[1]+' border=0 alt="Bild &quot;'+Dat+'&quot; ['+BildGroesse[0]+'x'+BildGroesse[1]+']"></a>\n');
    write('</body>\n</html>\n');
    close();
  }

  return false;
}
//-->
</script>

Dieses Skript kommt -iss ja logo- in den Head. Im Body verlinkst Du dann das kleine Bild mit dem großen. ! Achtung ! Der Name des großen Bildes muss dabei wie folgt aussehen:

"Name.breitexhöhe.jpg".

Dann kann die gesamte Verlinkung z.B. so aussehen:

<a href="Koenigin.425x265.jpg" target="_blank"><img src="Koenigin.jpg" width="142" height="88" border="0"></a><br>

Versuch's mal, bei mir klappt das wunderbar!

Gruss, Paco

kasamoto · 15. Juli 2004

Jubel....Yeahhhh!

Vielen, herzlichen Dank, Paco!

Dein Wunder-Script hat geholfen! Wahnsinn....bin begeistert!
Einfach wundervoll, wenn etwas klappt und so funktioniert, wie man es sich wünscht!

Der Unterschied zu normalen Fenstern oder auch zu den javascript-Fenstern mit weißem Rand ist enorm!

Einfach perfekt, wie die gleichmäßige Abgrenzung aussieht!

Hier kann man das Ergebnis nochmal sehen:
http://www.gifknaller.de/gifknaller_logo.htm

Bald werden alle Bilder auf meiner Page so dargestellt!

Nochmals VIELEN DANK, Paco!
Der Dank geht natürlich auch an Samuel für die bisherige Hilfe!

Herzliche Grüße & Ciao!
Ingo

Bild im onClick-Fenster ohne weißen Hintergrund an allen 4 Rändern anpassen!

kasamoto

Grünschnabel

Samuel

Erfahrenes Mitglied

kasamoto

Grünschnabel

Samuel

Erfahrenes Mitglied

kasamoto

Grünschnabel

Samuel

Erfahrenes Mitglied

kasamoto

Grünschnabel

Freesolo

Grünschnabel

kasamoto

Grünschnabel

Neue Beiträge