Avatar billede svjensen Nybegynder
08. oktober 2003 - 14:52 Der er 13 kommentarer og
2 løsninger

Problemer med popup vindue (centrering m.m.)

Jeg viser et billede i et popupvindue vha. følgende function:
<script language="javascript" type="text/javascript">

function PopupBillede(file, tekst)
{
    newWin=window.open("","VisBillede","scrollbars=no,status=no");
    newWin.document.writeln('<ht'+'ml>');
    newWin.document.writeln('<he'+'ad>');
    newWin.document.writeln('<ti'+'tle>'+file+'<\57tit'+'le>');
    newWin.document.writeln('<scr'+'ipt language="javascript" type="text/javascript">');
    newWin.document.writeln('function resPic() {');
    newWin.document.writeln('h=document.images[0].scrollHeight;');
    newWin.document.writeln('w=document.images[0].scrollWidth;');
    newWin.document.writeln('winTop=(screen.height-h)/2;');
    newWin.document.writeln('winLeft=(screen.widht-w)/2;');
    newWin.document.writeln('window.resizeTo(w+6,h+50);}');
    newWin.document.writeln('<\57sc'+'ript>');
    newWin.document.writeln('<\57he'+'ad>');
    newWin.document.writeln('<bo'+'dy style="border:0px;margin:0px" onload="resPic();">');
    newWin.document.writeln('<d'+'iv id="overDiv" style="position:absolute; visibility:hidden; z-index:1000;">');
    newWin.document.writeln('<\57d'+'iv>');
    newWin.document.write('<scr'+'ipt language="JavaScript" src="overlib.js">');
    newWin.document.write('<!'+'-- overLIB (c) Erik Bosrup --'+'><\57scr'+'ipt>');
    newWin.document.writeln('<cen'+'ter>');
    newWin.document.writeln('<a href="java script:void(0);" onmouseover="return overlib('+tekst+');" onmouseout="return nd();">');
    newWin.document.writeln('<i'+'mg name="billede" src="'+file+'" style="overflow:hidden;top:0px;left:0px;border:0px;">');
    newWin.document.writeln('<\57a>');
    newWin.document.writeln(tekst);
    newWin.document.writeln('<a href="java script:window.close();">Luk vinduet<\57a>');
    newWin.document.writeln('<\57ce'+'nter><\57b'+'ody><\57ht'+'ml>');

    newWin.document.close();

}

</script>

Jeg kalder functionen med:

<a href="#" onclick="PopupBillede('backfire.jpg', 'Det frygtede bombefly, Backfire.');return false;">Backfire.jpg</a>

Jeg har to spørgsmål:
1. Hvordan får jeg anvendt mine to variable (winTop og winLeft) til at centrere vinduet.
2.Ovenstående giver en fejl, når jeg inkluderer linket omkring billedet. Jeg ved at 'tekst' bliver ført med over, og 'tooltippet' (overlib) virker, når jeg tester det særskilt.
Avatar billede basicq Nybegynder
08. oktober 2003 - 15:27 #1
Til 1. prøv at se på det her stykke måske du kan bruge det.

myLeft = (screen.availWidth - 1014) / 2;
myTop = (screen.availHeight - 744) / 2;

window.open("main.php","","/*fullscreen*/,width=1014,height=744, left="+myLeft+",top="+myTop+"menubar=no,scrollbars=no,resizable=no,copyhistory=no");
Avatar billede mm12010 Nybegynder
08. oktober 2003 - 15:40 #2
<script language="JavaScript" type="text/javascript">
function PopupBillede(file, tekst){
    picture=new Image();
    picture.src=file;
    h=picture.height+40;
    w=picture.width;
    winTop=(screen.height-h)/2;
    winLeft=(screen.width-w)/2;
    alert("left="+winLeft+",top="+winTop);
    newWin=window.open("","VisBillede","height="+h+",width="+w+",top="+winTop+",left="+winLeft+",scrollbars=no,status=no");
    newWin.document.writeln('<ht'+'ml>');
    newWin.document.writeln('<he'+'ad>');
    newWin.document.writeln('<ti'+'tle>'+file+'<\57tit'+'le>');
    newWin.document.writeln('<\57he'+'ad>');
    newWin.document.writeln('<bo'+'dy style="border:0px;margin:0px">');
    newWin.document.writeln('<d'+'iv id="overDiv" style="position:absolute; visibility:hidden; z-index:1000;">');
    newWin.document.writeln('<\57d'+'iv>');
    newWin.document.write('<scr'+'ipt language="JavaScript" src="overlib.js">');
    newWin.document.write('<!'+'-- overLIB (c) Erik Bosrup --'+'><\57scr'+'ipt>');
    newWin.document.writeln('<cen'+'ter>');
    newWin.document.writeln('<a href="java script:void(0);" onmouseover="return overlib(\47'+tekst+'\47);" onmouseout="return nd();">');
    newWin.document.writeln('<i'+'mg name="billede" src="'+file+'" style="overflow:hidden;top:0px;left:0px;border:0px;">');
    newWin.document.writeln('<\57a>');
    newWin.document.writeln(tekst);
    newWin.document.writeln('<a href="java script:window.close();">Luk vinduet<\57a>');
    newWin.document.writeln('<\57ce'+'nter><\57b'+'ody><\57ht'+'ml>');
    newWin.document.close();
    }
</script>
Avatar billede mm12010 Nybegynder
08. oktober 2003 - 15:41 #3
slet bare denne linie:

alert("left="+winLeft+",top="+winTop);
Avatar billede svjensen Nybegynder
08. oktober 2003 - 22:41 #4
basicq -> jeg ser to problemer i dit forslag: for det første fjerner det min tilpasning til billedet størrelse, hvilket jeg dog godt kan abstrahere fra. Men for det andet, så har jeg allerede åbnet vinduet, hvilket præcis var det problem jeg ikke lige kunne se vejen ud af. Derfor, no points. Desværre

mm12010 -> Så hiver du igen point fra mig i dag  ;-)
Det virker uden problemer, men lige et opfølgende spørgsmål: Hvilket tegn skjuler sig bag \47?
Husk lige et svar

Søren
Avatar billede olebole Juniormester
09. oktober 2003 - 02:30 #5
<ole>

Et enkelt gåseøje.

I JavaScript må/kan du ikke bruge special-tegn eller HTML-entities. Der skal du bruge den escapede oktal-tal-værdi af tegnets keyCode.

Jeg har engang skrevet en lille konverter, du kan hente på:
  http://tjenester.dk/x-codes.dk/eksperten/oktal_konverter/

/mvh
</bole>
Avatar billede svjensen Nybegynder
09. oktober 2003 - 07:48 #6
Ole -> Tak for det. Jeg har først for nyeligt taget springet videre fra asp til javascript, og det er nærmest,som at skulle lære et nyt sprog.

mm12010 (og andre) -> Jeg var måske lige hurtig nok i går aftes. Scriptet virker upåklageligt hjemme på min egen maskine (win xp og IIS), men på det site (www.silkeborgbasketball.dk/popup.asp), hvor den skal bruges er der lidt problemer med 'overlib' delen.

Den loader det nye vindue, resizer det og centrerer det, men så er den som om browseren hænger uden at komme videre. Der bliver altså ikke loadet noget billede. Jeg har prøvet at fjerne overlib delen fra scritet og så virker det. Men Jeg vil jo meget gerne have den del til at virke også.

Jeg har fået overlib kaldet til at virke andre steder på sitet (fx .../teams.asp, hvor der loades en box ved mouseover kameraerne), så jeg kan ikke helt forstå hvor problemet er.
Avatar billede olebole Juniormester
09. oktober 2003 - 08:13 #7
Hehe ... Du har to JavaScript-funktioner, der hedder 'PopupBillede1()' - men ikke nogen, der hedder 'PopupBillede()'  ;o))
Avatar billede svjensen Nybegynder
09. oktober 2003 - 08:20 #8
ups. Jeg var lidt for hurtig i min iver over at ville lave begge modeller. Det er nu ændret
Avatar billede olebole Juniormester
09. oktober 2003 - 08:39 #9
Der bliver brugt forkert JS-udkommentering. Sådan:
    newWin.document.write('/* overLIB (c) Erik Bosrup */<\57scr'+'ipt>');
Avatar billede olebole Juniormester
09. oktober 2003 - 08:42 #10
Og så skal du i virkeligheden skifte specialtegnene ud  ;o)

I øvrigt er det kun <script></script> tags, du behøver splitte op:
  '<scr'+'ipt></scr'+'ipt>'
Du behøver ikke splitte alle de andre HTML-tags. JavaScript må bare ikke skrive sine egne tags.
/mvh
Avatar billede mm12010 Nybegynder
09. oktober 2003 - 09:22 #11
godmorgen :o)
Avatar billede svjensen Nybegynder
09. oktober 2003 - 09:35 #12
olebole -> Jeg har nu sat din linie ind i stedet for den oprindelige, men problemet består. Den hænger stadig
Hvad er det for specialtegn du tænker på?
Avatar billede olebole Juniormester
09. oktober 2003 - 09:58 #13
Det er sikkert resize-funktionen, der kolliderer med nogle ting, sat i overlib.js ...(?)
Avatar billede svjensen Nybegynder
09. oktober 2003 - 11:21 #14
Ja, det kan jo da godt være. SOm jeg nævnte tidligere,så er jeg ikke nogen ørn til javascript - endnu ;-)
Hvis du gider, må du meget gerne kigge lidt på det. Overlib findes her: http://www.bosrup.com/web/overlib/
Avatar billede svjensen Nybegynder
28. oktober 2003 - 11:34 #15
Det ser ikke ud til at jeg kan få løst mit problem nr. 2, så jeg tager selv halvdelen af pointene.
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester