Hi, ich hab mal folgendes Skript gefunden:
<script language="JavaScript">
<!--
/**
* Javascript Window Popper V1.01
* ------------------------------
* Browser unabhängiger Fenster öffner
*
* Methoden:
*
* 1) popup( url, width, height, top, left, name, features )
*
* Öffnet ein neues Fenster mit der angegebenen URL, Breite und Höhe. Das Fenster wird
* auf dem Bildschirm zentriert, wenn die Angaben top und left fehlen.
*
* Wenn kein Name angegeben wird, wird ein eindeutiger Name automatisch generiert.
* Falls keine Features angegeben werden, erhält das Fenster auch keine. Wenn ein Feature
* gewünscht wird, kann dieses einfach durch seinen Namen angegeben werden.
*
* Unterstützte Features sind:
* toolbar, scrollbars, menubar, resizeable, status, location, directories
*
* Beispiel: popup( "help.html", 420, 420, null, null, "help", "scrollbar" );
*
* Variablen:
*
* 1) defaultWidth Voreingestellte Breite, falls der Parameter bei width popup() fehlt
*
* 2) defaultWidth Voreingestellte Höhe, falls der Parameter height bei popup() fehlt
*
*/
var defaultWidth = 580;
var defaultHeight = 420;
// --------------------------------------------------------------------------------------
// private
var count = 0;
// popup( url, <name>, <features>, width, height, top, left )
function popup( url, width, height, top, left, name, features )
{
if( width == null ) width = defaultWidth;
if( height == null ) height = defaultHeight;
if( document.all )
{
availWidth = window.screen.availWidth;
availHeight = window.screen.availHeight;
if( top == null ) top = ",top=" + ( availHeight / 2 - height / 2 ); else top = ",top=" + top;
if( left == null ) left = ",left=" + ( availWidth / 2 - width / 2 ); else left = ",left="+ left;
}
else
{
if( top == null ) top = (screen.height) ? ",screenY=" + (screen.height / 2 - height / 2 ) : ""; else top = ",screenX="+ top;
if( left == null ) left = (screen.width) ? ",screenX=" + (screen.width / 2 - width / 2 ) : ""; else left = ",screenY="+ left;
}
tmp = ""
if( features != null && typeof( features ) == "string" ) {
tmp = "toolbar=" + ( features.indexOf("toolbar") > - 1 ? "yes" : "no" ) + ",";
tmp += "scrollbars=" + ( features.indexOf("scrollbar") > - 1 ? "yes" : "no" ) + ",";
tmp += "menubar=" + ( features.indexOf("menubar") > - 1 ? "yes" : "no" ) + ",";
tmp += "resizable=" + ( features.indexOf("resizable") > - 1 ? "yes" : "no" ) + ",";
tmp += "status=" + ( features.indexOf("status") > - 1 ? "yes" : "no" ) + ",";
tmp += "location=" + ( features.indexOf("location") > - 1 ? "yes" : "no" ) + ",";
tmp += "directories=" + ( features.indexOf("directories") > - 1 ? "yes" : "no" ) + ",";
features = tmp+"width="+ width +",height="+ height + top + left;
} else {
features = "toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=no,"
+ "resizable=no,width="+ width +",height="+ height + top + left;
}
// alert( features );
if( name == null ) {
id = count + Math.floor( Math.random() * 8192 );
name = "Win"+id;
}
win = window.open( url, name, features);
count++;
if( win ) {
win.focus();
}
}
//-->
</script>
Allerdings komm ich damit nicht klar. Momentan hab ich die Links folgendermaßen gelöst: (Ich hätte auch noch ganz gern ein "Schließen-Button" oder besser noch auf das Bild im Popup klicken um zu schließen, aber ich glaub das ist nicht so einfach umsetzbar)
<a href="http://xyz.jpg" onClick="pop = window.open
(this.href,'a', 'width=820,height=624,scrollbars=auto,top=100,left=120');
pop.focus(); return false;" onFocus="this.blur()">
Allerdings weiß ich nich 100%ig wie dies funktioniert, wofür ist z.B. der Name 'a' ?
Sollte man eigentlich CSS oder JS script-Tags als Kommentar oder ohne Kommentar schreiben?
Noch ein Problem, ich habe folgendes Bild in einer Tabelle, wollte aber ganz gern, dass wenn man auf den unteren Balken geht, dieser sich komplett blau verfärbt. Ist aber glaub auch nur schwer lösbar.
<table bgcolor="#E1E1E1">
<tr>
<td style="width:140px;background-color:#C0C0C0;text-align:center">
<img src="http://bla.jpg" width="140" height="105" style="border:2px solid blue;cursor:pointer"
onClick="bild.src='http:bla.jpg';" onFocus="this.blur()">
<a href="http://blub.jpg" onClick="pop = window.open
(this.href,'a', 'width=820,height=624,scrollbars=auto,top=100,left=120');
pop.focus(); return false;" onFocus="this.blur()">
<font size="2" face="Arial"><b> Großes-Bild </b></font></a>
</td>
<tr>
<td bgcolor="#E1E1E1">
<b class="spiffy">
<b class="spiffy5"></b>
<b class="spiffy4"></b>
<b class="spiffy3"></b>
<b class="spiffy2"><b></b></b>
<b class="spiffy1"><b></b></b></b>
<br>
</td>
</tr>
</table>
Hier das dazugehörige CSS-Skript:
.spiffy{display:block}
.spiffy *{
display:block;
height:1px;
overflow:hidden;
font-size:.01em;
background:#c0c0c0}
.spiffy1{
margin-left:3px;
margin-right:3px;
padding-left:1px;
padding-right:1px;
border-left:1px solid #d2d2d2;
border-right:1px solid #d2d2d2;
background:#c8c8c8}
.spiffy2{
margin-left:1px;
margin-right:1px;
padding-right:1px;
padding-left:1px;
border-left:1px solid #dddddd;
border-right:1px solid #dddddd;
background:#c6c6c6}
.spiffy3{
margin-left:1px;
margin-right:1px;
border-left:1px solid #c6c6c6;
border-right:1px solid #c6c6c6;}
.spiffy4{
border-left:1px solid #d2d2d2;
border-right:1px solid #d2d2d2}
.spiffy5{
border-left:1px solid #c8c8c8;
border-right:1px solid #c8c8c8}
.spiffyfg{
background:#c0c0c0}
Dieses Skript bräuchte ich dann halt in zweifacher ausführung, eines noch in blau.
Ich hoffe, dass ihr nachvollziehen könnt was ich mein.