Popups immer zentral in der Bildschirmmitte öffnen.

Herr Nack

Hallo, Tag!

Ich hab hier wieder ein nicht so ganz WP-spezifisches Designproblem
und würde da gerne höflich um Rat fragen wollen, bitte. Vielleicht hat
mir da wer eine Lösung wäre super.

Auf meiner Seite lasse ich Fotos und Videos gerne mal innem Popup öffnen.
Ich versuche das immer so hinzubiegen, dass das Fenster dann möglichst in
der Bildschirmmitte aufgeht. Mit den Begriffen "left" und "top". Also etwa so:

Code

<a href="URL" onclick="window.open(this.href, '_blank', 'width=470,
height=372,[COLOR=Red]left=200,top=210[/COLOR],scrollbars=no,resizable=no, toolbar=
no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); 
return false">

Das hat soweit auch ganz gut hin. Bringt aber natürlich nix, wenn jemand
mitner anderen Bildschirmauflösung guckt. Wie könnte ich das nur hinbiegen,
dass das Popup immer in der Bildschirmmitte aufgeht, ega welche Auflösung
der Leser benutzt?

Habs schon mit prozentualen Angaben versucht:

Code

<a href="URL" onclick="window.open(this.href, '_blank', 'width=470, 
height=372,[COLOR=Red]left=50pt,top=50pt[/COLOR],scrollbars=no,resizable=no, toolbar=
no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); 
return false">

Das funktioniert aber auch nicht, soweit ich das sehe. Weiß da
vielleicht wer was, wie ich das machen könnte? Das wäre super,
ich würd mich sehr freuen!

Alles Gute
Herr Nack

Werbepost

Hallo!

Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
✔️ Deutsche Server & DSGVO-konform
✔️ Persönlicher Support (kein 0815-Ticket-System)

Mehr erfahren

Herr Nack

Hmm, darf ich bitte mal höflich das Thema hier aufwärmen...?

Ich versuch das gerade wieder die ganze Zeit aber ich schaffs einfach nicht.
Jetzt habe ich das so versucht aber ich kriegs immer noch nicht hin, dass das Popup immer in der Bildschirmmitte angezeigt wird, egal bei welcher Auflösung:

Code

<a href="http://www.nackonet.de/codes/video/31.HTML"
onclick="window.open(this.href, '_blank', 'width=470, 
height=372,left=50%,top=50%, 
scrollbars=no,resizable=no,toolbar=no,directories=no,
location=no,menubar=no,status=no,left=0,top=0'); 
return false">KLICKZUMGUCK</a>

Ich hab auch schon versucht, an diversen Stellen margin-left: 235px und margin-top: 186px einzufügen, aber das klappte nie.

Bitte, weiß vielleicht jemand wie ich diesen Code modifizieren muss, damit das Popup immer in der Bildschirmmitte angezeigt wird bei Draufklick?

Alles Liebe und Gute
Herr Nack

leviathan

Versuch mal das hier:

Code

function pop()
{
var w = 400; //Breite des neuen Fensters
var h = 300; //Höhe des neuen Fensters


var l = (screen.width) ? (screen.width-w)/2 : 0;
var t = (screen.height) ? (screen.height-h)/2 : 0;


var popup = window.open(url,"n",'toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=no,resizable=no,copyhistory=no,width='+w+',height='+h+',left='+l+',top='+t+'');
}

Alles anzeigen

Und Einbindung von pop() dann als

Code

href="javascript:pop(url='xy.html')

oder mit onclick.

Das öffnet ein Fenster ohne toolbars etc....also eher etwas, was man nicht machen sollte. Ich hatte das vor Urzeiten mal genutzt, um HTML-Seiten per Pop-Up aufzurufen, sollte aber auch klappen, wenn man direkt Bilder aufruft.

Ansonsten habe ich noch das hier auf meiner Festplatte gefunden, das generiert dann ein HTML-File on the fly:

HTML

<!--
if (document.images) {


  var openNewWin=false;


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


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


  window.onload=picopenInit;


}


function picopenInit()
{
  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 = picopen;


  }
}


function picopen()
{
  var PicName = this.href.split('.');
  var PicSize = PicName[PicName.length-2].split('x');
  var ModX=0, ModY=0, Dat=this.href.split('/'); Dat=Dat[Dat.length-1];
  if (!document.layers && !document.all) { ModX=0;ModY=0; }
  var width=parseInt(PicSize[0])+ModX;
  var height=parseInt(PicSize[1])+ModY;
  var Param = 'width='+width+',height='+height+',toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=no,resizable=no,copyhistory=no';
    Param += ',left='+(screen.width/2-width/2)+',top='+(screen.height/2-height/2);


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


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


  with (window[winName].document) {
    open();
    write('<html>\n<head>\n<title>&nbsp;&nbsp;&nbsp;|&nbsp;W&nbsp;|&nbsp;A&nbsp;|&nbsp;I&nbsp;|&nbsp;T&nbsp;|&nbsp;I&nbsp;|&nbsp;N&nbsp;|&nbsp;G&nbsp;|&nbsp;4&nbsp;|&nbsp;U&nbsp;|&nbsp;T&nbsp;|&nbsp;O&nbsp;|&nbsp;P&nbsp;|&nbsp;I&nbsp;|&nbsp;A&nbsp;|&nbsp;&nbsp;&nbsp;</title><meta http-equiv="imagetoolbar" content="no">\n</head>\n');
    write('<body style="margin:0px; padding:0px" oncontextmenu="return false" ondragstart="return false" onselectstart="return false">\n');
    write('<span title="click to close window" OnClick="self.close()"><img src="'+this.href+'" width='+PicSize[0]+' height='+PicSize[1]+' border=0 alt="click to close window"></span>\n');
    write('</body>\n</html>\n');
    close();
  }


  return false;
}




//  -->

Alles anzeigen

Das Script am besten auslagern, mit

Code

<script language="JavaScript" src="popup.js" type="text/javascript">
</script>

einbinden.

Als Aufruf reicht dann einfach

Code

<a title="click to enlarge" href="bildname.300x300.jpg">

Wer JS aktiviert hat, bekommt ein Pop-Up, andere sehen halt das Bild direkt im Browser.

Wobei die Bildgröße immer im Namen auftauchen muß z.B. 300x300 oder 600x400 etc.

Willkommen! Melden Sie sich an oder registrieren Sie sich.

Popups immer zentral in der Bildschirmmitte öffnen.

Jetzt mitmachen!