Avatar billede freakazoid18 Nybegynder
05. maj 2003 - 18:05 Der er 13 kommentarer og
1 løsning

Popup.

Jeg ska lige bruge noget som dette..

http://www.eterno.dk/event_pics.php - det er kun den måde som billederne popper up på.. altså den selv tilpasser sig rigtig størrelse..

<IMG src="/images/crew/fraggel.jpg" border="0" height="110" width="140" /> det er emnet som ska linkes om...
Avatar billede grunken Nybegynder
05. maj 2003 - 18:09 #1
<html>
<head>
<script type="text/JavaScript">

var billede;

function NewWindow(url) {

  var streng="<html><body leftmargin=0 topmargin=0 bgcolor=#000000>";
  streng+='<img src=\"'+url+'\"></body></html>';

  billede = new Image();
  billede.src = url;

  var t = new Date().getTime();
  var hojde = (billede.height+30)
  var bredde = (billede.width+10)
  var horisontal = (screen.width - bredde)/2;   
  var vertikal =  (screen.height - hojde)/2;

  win = window.open('','link'+t,'height='+ hojde + ',width=' + bredde + ', top=' + vertikal + ', left='+horisontal)

  win.document.open();
  win.document.write(streng);
  win.document.close();

  win.resizeTo (bredde, hojde)
}
</script>
</head>
<body>
<a href="billede.jpg" onclick="NewWindow(this.href);return false;">TEST</a>

</body>
</html>
Avatar billede olebole Juniormester
05. maj 2003 - 19:11 #2
<ole>

grunken >> Du har ingen garanti for, at billedet er loadet, når du prøver at aftaste dets dimensioner. Prøv med et stort, tungt billede  ;o)

/mvh
</bole>
Avatar billede grunken Nybegynder
06. maj 2003 - 01:55 #3
Jeps Ole havde som sædvanlig ret :(

den her burde du : http://www.grunken.dk/exp/348799.html

kopier kilden!

Og ole lige et spørgsmål hvorfor #@$G%& vil NS have scrolbars med ?
Avatar billede olebole Juniormester
06. maj 2003 - 03:49 #4
Fordi scroll="no" er proprietær MS-kode. Prøv med noget overflow:hidden  ;o)
/mvh
Avatar billede jakobclausen Nybegynder
06. maj 2003 - 04:16 #5
<-- Sættes ind mellem <head> og </head> -->

<Script Language="JavaScript">
// Script Source: CodeLifter.com
// Copyright 2003
// Do not remove this notice.

// SETUPS:
// ===============================

// Set the horizontal and vertical position for the popup

PositionX = 100;
PositionY = 100;

// Set these value approximately 20 pixels greater than the
// size of the largest image to be used (needed for Netscape)

defaultWidth  = 500;
defaultHeight = 500;

// Set autoclose true to have the window close automatically
// Set autoclose false to allow multiple popup windows

var AutoClose = true;

// Do not edit below this line...
// ================================
if (parseInt(navigator.appVersion.charAt(0))>=4){
var isNN=(navigator.appName=="Netscape")?1:0;
var isIE=(navigator.appName.indexOf("Microsoft")!=-1)?1:0;}
var optNN='scrollbars=no,width='+defaultWidth+',height='+defaultHeight+',left='+PositionX+',top='+PositionY;
var optIE='scrollbars=no,width=150,height=100,left='+PositionX+',top='+PositionY;
function popImage(imageURL,imageTitle){
if (isNN){imgWin=window.open('about:blank','',optNN);}
if (isIE){imgWin=window.open('about:blank','',optIE);}
with (imgWin.document){
writeln('<html><head><title>Loading...</title><style>body{margin:0px;}</style>');writeln('<sc'+'ript>');
writeln('var isNN,isIE;');writeln('if (parseInt(navigator.appVersion.charAt(0))>=4){');
writeln('isNN=(navigator.appName=="Netscape")?1:0;');writeln('isIE=(navigator.appName.indexOf("Microsoft")!=-1)?1:0;}');
writeln('function reSizeToImage(){');writeln('if (isIE){');writeln('window.resizeTo(100,100);');
writeln('width=100-(document.body.clientWidth-document.images[0].width);');
writeln('height=100-(document.body.clientHeight-document.images[0].height);');
writeln('window.resizeTo(width,height);}');writeln('if (isNN){');     
writeln('window.innerWidth=document.images["George"].width;');writeln('window.innerHeight=document.images["George"].height;}}');
writeln('function doTitle(){document.title="'+imageTitle+'";}');writeln('</sc'+'ript>');
if (!AutoClose) writeln('</head><body bgcolor=000000 scroll="no" onload="reSizeToImage();doTitle();self.focus()">')
else writeln('</head><body bgcolor=000000 scroll="no" onload="reSizeToImage();doTitle();self.focus()" onblur="self.close()">');
writeln('<img name="George" src='+imageURL+' style="display:block"></body></html>');
close();       
}}
</script>

<-- Sættes ind mellem <body> og </body> -->


<a href="java script:popImage('stortbillede.gif','Some Title')">
<img src="lillebillede.gif" alt="Se stort billlede">
</a>

Se eksempel: www.bokaj.dk/eksperten/gribben/
http://www.codelifter.com/main/javascript/autosizeimagepopup.html
Avatar billede olebole Juniormester
06. maj 2003 - 15:11 #6
Du godeste .... sikke en masse kode til den lille opgave  :)

Det ville nok være en fordel at fylde linierne i en buffer - og så skrive strengen til sidst. Det er i sig selv langt hurtigere (op til 200-300 gange) - og så slipper man også af med 'with()', som også er yderst ineffektiv.
/mvh
Avatar billede jakobclausen Nybegynder
06. maj 2003 - 15:30 #7
olebole >> Er det i mine kode man skal gøre det ?
Avatar billede olebole Juniormester
06. maj 2003 - 15:45 #8
yups .... efter 'with (imgWin.document){' står der en masse 'writeln()'.

Den der 'with-ting' gør, at du slipper for at skrive
  imgWin.document.writeln("streng")
hvergang. Men den gør scriptet langsomt.

Gør sådan i stedet:

var a = new Array();
a[a.length] = "Første linie her";
a[a.length] = "Anden linie her";
a[a.length] = "Tredie linie her";
/*  osv osv osv  */
imgWin.document.write( a.join("\n" );
imgWin.document.close();

Det er _langt_ hurtigere  ;o)
/mvh
Avatar billede jakobclausen Nybegynder
06. maj 2003 - 15:59 #9
olebole >> Undskyld jeg er ikke helt med, gider du prøve at poste hele scriptet som du vil lave det?
Avatar billede olebole Juniormester
06. maj 2003 - 16:25 #10
Jeg ville nok også skrive andre ting anderledes, men her kan du se selve pop-koden:

// Do not edit below this line...
// ================================
if (parseInt(navigator.appVersion.charAt(0))>=4){
var isNN=(navigator.appName=="Netscape")?1:0;
var isIE=(navigator.appName.indexOf("Microsoft")!=-1)?1:0;}
var optNN='scrollbars=no,width='+defaultWidth+',height='+defaultHeight+',left='+PositionX+',top='+PositionY;
var optIE='scrollbars=no,width=150,height=100,left='+PositionX+',top='+PositionY;
function popImage(imageURL,imageTitle){
    if (isNN){imgWin=window.open('about:blank','',optNN);}
    if (isIE){imgWin=window.open('about:blank','',optIE);}
    var a = new Array();
    a[length] = '<html><head><title>Loading...</title><style>body{margin:0px;}</style>';
    a[length] = '<sc'+'ript>';
    a[length] = 'var isNN,isIE;';
    a[length] = 'if (parseInt(navigator.appVersion.charAt(0))>=4){';
    a[length] = 'isNN=(navigator.appName=="Netscape")?1:0;';
    a[length] = 'isIE=(navigator.appName.indexOf("Microsoft")!=-1)?1:0;}';
    a[length] = 'function reSizeToImage(){';
    a[length] = 'if (isIE){';
    a[length] = 'window.resizeTo(100,100);';
    a[length] = 'width=100-(document.body.clientWidth-document.images[0].width);';
    a[length] = 'height=100-(document.body.clientHeight-document.images[0].height);';
    a[length] = 'window.resizeTo(width,height);}';
    a[length] = 'if (isNN){';
    a[length] = 'window.innerWidth=document.images["George"].width;';
    a[length] = 'window.innerHeight=document.images["George"].height;}}';
    a[length] = 'function doTitle(){document.title="'+imageTitle+'";}';
    a[length] = '</sc'+'ript>';
    if (!AutoClose) a[length] = '</head><body bgcolor=000000 scroll="no" onload="reSizeToImage();doTitle();self.focus()">';
    else a[length] = '</head><body bgcolor=000000 scroll="no" onload="reSizeToImage();doTitle();self.focus()" onblur="self.close()">';
    a[length] = '<img name="George" src='+imageURL+' style="display:block"></body></html>';
    imgWin.document.write(a.join("\n");
    imgWin.document.close();       
}

Du skulle nok kunne finde den tilsvarende del i den kode, du selv postede  :)
/mvh
Avatar billede olebole Juniormester
06. maj 2003 - 16:27 #11
Ooooops .... jeg glemte en parentes-slut i slutningen af script'et:

    imgWin.document.write( a.join("\n") );
    imgWin.document.close();       
}

Sådan  ;o)
Avatar billede olebole Juniormester
06. maj 2003 - 16:33 #12
Jeg opretter et array 'a' som en 'buffer'. I det array fylder jeg så alle de linier, der skal skrives ud.
Derefter kan jeg join'e array'et omkring en new-line '\n'. Alle elementerne i array'et smeltes sammen til én lang streng med en new-line imellem de enkelte elementer. Det gør, koden kommer til at stå pænt på enkelt linier i View-Source.

Hele koden skrives ud med én 'document.write()' - hvilket er langt hurtigere. Tager du tid på dit oprindelige script og et med min ændring, vil du formodentlig opleve, at den nye kode afvikles 200-300 gange hurtigere! Det er jo også værd at tage med  ;o)
/mvh
Avatar billede freakazoid18 Nybegynder
06. juli 2003 - 12:55 #13
..
Avatar billede jakobclausen Nybegynder
06. juli 2003 - 15:08 #14
freakazoid18 >> Det eneste man hører fra dig i dette spørgsmål er dit slutbemærkning ".." hvor du selv tager pointene.

Kan du slet ikke bruge noget af alt det vi har svaret ?
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