pop-up titel @ tutorials.de: Tutorials, Forum & Hilfe

egreis · 13.05.03 18:20

Hallo,

ich habe folgendes Problem. Mit JS öffne ich ein pop-up und das klappt auch ganz gut, kein Thema. Leider habe ich in der Titelleiste, oben links im pop-up, immer den Pfad drin stehen anstatt einen schönen Titel/Namen.

Kann mir jemand weiterhelfen?

Danke.

Andreas Gaisbauer · 13.05.03 21:23

Hallo,

Zeig mal wie du den Popup realisierst...
Präventiv schon mal http://selfhtml.teamone.de/javascrip...indow.htm#open

ciao

SilentWarrior · 13.05.03 21:36

egreis: Falls das PopUp lediglich ein Bild ist, wirst du daran nichts ändern können. Lediglich eine aufgerufene HTML-Datei mit darin definiertem Titel könnte da was bewerkstelligen.

egreis · 14.05.03 08:23

@ silent warrior:

Da ich leider tatsächlich ein jpg aufrufe, wird sich daran wohl kaum was ändern lassen.

Bei html ist es ja kein problem, da brauch ich ja auf der Seite nur den Titel ändern.

Danke.

Andreas Gaisbauer · 14.05.03 19:03

Hallo,

das is eigentlich egal - du kannst ja das HTML, sozusagen on-the-fly, erzeugen... Hatte die Funktion auch mal gebraucht - funktioniert einfwandfrei...

PHP-Code:


<html>

<head>

<script type="text/JavaScript">

<!--

function openWin(titel,img,alt) {

  popup = open("", "", "width=600,height=600,status=no,toolbar=no,menubar=no");

  popup.document.open();

      popup.document.write("<html><head><title>"+titel+"</title></head><body>");

      popup.document.write("<img src=\""+img+"\" alt=\""+alt+"\">");

      popup.document.write("</body></html>");

  popup.document.close();  

}

// -->

</script>

</head>

<body>

<a href="#" onClick="openWin('Photo 01','1.jpg','Alternativ Beschreibung für das Bild')">Link_Bild1</a>

</body>

</html>

die Funktion wird so aufgerufen:

Code :

1	<a href="#" onClick="openWin('Photo 01','1.jpg','Alternativ Beschreibung für das Bild')">Link_Bild1</a>

erster Parameter ist der Titel;
zweiter Parameter das zu ladende Bild;
dritter Parameter ist der Text für das "alt"-Attribut...

die Funktion lässt sich sehr leicht erweitern (zum Beispiel für Height und Width)...

Hoffe das hilft dir etwas weiter...

ciao

egreis · 15.05.03 08:32

Vielen Dank, das Script funktioniert einwandfrei!

Eine Frage hab ich noch. Wie kann ich die width und die height im JS ändern? Da viele Bilder eine unterschiedliche Grösse haben, würde ich ganz gerne diese Werte mit dem Link übergeben, ähnlich wie es mit dem Titel und der Quelle getan wird...

Danke nochmals.

Andreas Gaisbauer · 15.05.03 11:59

Bitteschön

PHP-Code:


<html>

<head>

<script type="text/JavaScript">

<!--

function openWin(titel,img,alt,size) {

  popup = open("", "", size, "status=no,toolbar=no,menubar=no");

  popup.document.open();

      popup.document.write("<html><head><title>"+titel+"</title></head><body>");

      popup.document.write("<img src=\""+img+"\" alt=\""+alt+"\">");

      popup.document.write("</body></html>");

  popup.document.close();  

}

// -->

</script>

</head>

<body>

<a href="#" onClick="openWin('Photo 01','1.jpg','Alternativ Beschreibung für das Bild','width=500, height=600')">Link_Bild1</a>

</body>

</html>

ciao

//edit: Besonders praktisch wenn du die Größe der Bilder mit PHP auslesen lassen kannst, ansonsten wirds bei mehrenen Bildern etwas aufwendig...

mzeem · 04.01.08 17:46

kann man das vielleicht noch ergänzen, dass das POP-Fenster weiß wie groß das Bild ist?

Das würde mir jetzt sehr helfen

FipsTheThief · 04.01.08 22:25

Dazu müsstest ein Image Object erstellen und da das Bild reinladen.

Code :

   var image = new Image();
        image.src = 'deine url zum Bild';
        image.onload = function () {
             var h = image.height;
             var w = image.width;
 
             //popup code nun 
        }

mzeem · 05.01.08 15:32

wie man sieht versteh ich nicht viel von JS. Und irgendwie funktioniert das nicht

Code :

<script language="JavaScript" type="text/javascript">
    var image = new Image();
        image.src = '<?php echo"$img"; ?>';
        image.onload = function () {
            var h = image.height;
            var w = image.width;
 
                function openWin(titel,img,alt,size) {
                popup = open("", "", size, "status=no,toolbar=no,menubar=no");
                    popup.document.open();
                    popup.document.write("<html><head><title>"+titel+"</title></head><body>");
                    popup.document.write("<img src=\""+img+"\" alt=\""+alt+"\">");
                    popup.document.write("</body></html>");
                popup.document.close();  
                } 
            }
//-->
</script>

LINK:

Code :

1
2
3

<?php
echo"<a href=\"javascript:openWin('Photo 01','$img')\">LINK</a>";
?>

FipsTheThief · 05.01.08 16:29

Naja das konnte auch nicht wirklich funktionieren

Du rufst eine Funktion auf die gar nicht im sichtbaren Bereich ist.

Onload findet erst dann statt wenn das Bild geladen wurde , innerhalb dieses onloads hast die Funktion definiert.

Code :

<html>
    <head>         
    <script language="JavaScript" type="text/javascript">
        function openWin(titel,img,alt) {
            var image = new Image();
            image.onload = function () {
                var h = image.height;
                var w = image.width;
                
                popup = open("", "","width="+w+",height="+h+",status=no,toolbar=no,menubar=no");
                popup.document.open();
                popup.document.write("<html><head><title>"+titel+"</title></head><body>");
                popup.document.write("<img src=\""+img+"\" alt=\""+alt+"\">");
                popup.document.write("</body></html>");
                popup.document.close();  
            }
        image.src = img;
        }
    </script>
    </head>
    <body>
        <a href="#" onClick='openWin("bildchen","DasBild.jpg")'>klick</a>
    </body>
</html>

Wobei mir auch noch ein Fehler unterlaufen ist , der Onload Event muss vor dem image.src stehen für den Opera , sonst zündet der Onload nie.Im FF ging es hingegen naja

Nachtrag , nun musst nur noch das CSS fertig machen für das Popup für die traditionellen Abstände von oben und links.

Code :

   html , body {
       margin:0px;
       padding:0px;
   }

mzeem · 05.01.08 19:46

Dann werde ich das mal so testen! Danke!

Melde mich wenn es nicht klappt

mzeem · 05.01.08 20:00

Melde mich nochmal weil es geklappt hat

Vielen Dank

tut orials.de	tut verbinden	tut dir helfen	tut kooperieren
©2000-2012 tutorials.de Alle Rechte vorbehalten	tut informieren » Impressum » Nutzungsregeln » Netiquette » Team » Redaktion	» Tutorials » Videotutorials » Showroom » Events & Contests » Chat » RSS-Feed » Blogs	» der-webdesigner.net » DesignerInAction » Design Nation » Directorforum » Flashhilfe » PHP-Resource » PHPwelt » PSD-Tutorials

Themen-Optionen

Anzeige

Ähnliche Themen

Titel

Titel änderbar? (Wenn das gelesen wird, ist der Titel erfolgreich geändert worden ;))

Titel von Pop-Ups

Titel Bar!

Titel einbringen

E-Mail:

Abonnieren Abbestellen