Avatar billede thanatos Nybegynder
14. januar 2005 - 11:26 Der er 9 kommentarer og
1 løsning

Popup's bredde der afhæner af billedets højde

Jeg vil lave en popup der altid har en højde på 450 og kan indeholde billeder som har forskellige højder og bredder, og det kan gøres ved at angiver forholdet mellem billedets højde og bredde og så ganger det med 450 a la (billedeB / billedeH) * 450

Jeg har prøvet at lave det, men det er svært for mig som ingen erfaringer har angående JavaScript. Kan nogen her hjælpe mig med koden? Min kode er således:

<script type="text/javascript">
Function Popup(Billedeid) {
 
  Gallimg = new image()
  Gallimg.src = "images/'+billedeid+'.jpg"
  Gallimg.BB = Gallimg.image.height
  Gallimg.BH = Gallimg.image.width
  Width = Gallimg.BB/Gallimg.BH*450

  pop = window.open('','Galleri','height=450,width='+Width+',scrollbars=no');
  pop.document.write('<body style="margin:0px;"><img src="images/'+Billedeid+'-big.jpg" height="450" onclick="window.close();">');
  pop.document.close(); 
}
</script>

BODY:
<a href="" onclick="Popup('2');return false;"><img src="images/2.jpg" border="0"></a>

Men det virker tilsynladen ikke - hvad har jeg gjort glat? mon det er nogen derude som kan hjælpe?
Avatar billede steffansteffan Nybegynder
14. januar 2005 - 11:30 #1
Ved ikke om det kan hjælpe dig, men prøv og leg lidt med den der:

<script>

// 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>

<a href="java script:popImage('../" & rs12("billedesti") & "','Profil Billede')">
Avatar billede thanatos Nybegynder
14. januar 2005 - 11:38 #2
Det er en kode som (så vildt jeg kan se i koden) resizer vinduen EFTER det er poppet frem - er det da ikke muligt at angiver bredden FØR det bliver poppet frem? Er der da nogle glat med min kode eller?
Avatar billede thomas_yde Nybegynder
14. januar 2005 - 11:44 #3
java er casesensitive, så billedeid er ikke lig med Billedeid
og Function skal være function

prøv den her:

<script type="text/javascript">
function imagePop(sender,picId) {
  Gallimg = new Image()
  Gallimg.src = "images/"+picId+".jpg";
  popWidth = sender.width;
  popHeight = sender.height;
  popWidth = (popWidth/popHeight)*450;
  pop = window.open('','Galleri','height=450,width='+popWidth+',scrollbars=no');
  pop.document.write('<body style=\"margin:0px;\"><img src=\"images/'+picId+'\.jpg\" height=\"450\" onclick=\"window.close();\"></body>');
  pop.document.close(); 
}
</script>

BODY:
<img src="images/2.jpg" border="0" onClick="imagePop(this,2);"><BODY>
Avatar billede thomas_yde Nybegynder
14. januar 2005 - 11:45 #4
Ved ikke om det hjælper dig :)
Men den virker da hos mig.
Avatar billede thomas_yde Nybegynder
14. januar 2005 - 11:47 #5
pop.document.write('<body style=\"margin:0px;\"><img src=\"images/'+picId+'-big.jpg\" height=\"450\" onclick=\"window.close();\"></body>');
Avatar billede thanatos Nybegynder
14. januar 2005 - 12:56 #6
Mange tak skal du ha', thomas!! Det virker helt fint, MEN... jeg har to forskellige billeder, en i thumbs-størrelse, som hedder 2.jpg og en i big-sized som hedder 2-big.jpg... så "this" commanden virker vist ikke rigtig - hvordan gør jeg det?

På forhånden tak
Avatar billede thomas_yde Nybegynder
14. januar 2005 - 13:04 #7
<script type="text/javascript">
function imagePop(picId) {
  Gallimg = new Image()
  Gallimg.src = "images/"+picId+"-big.jpg";
  popWidth = Gallimg.width;
  popHeight = Gallimg.height;
  popWidth = (popWidth/popHeight)*450;
  pop = window.open('','Galleri','height=450,width='+popWidth+',scrollbars=no');
  pop.document.write('<body style=\"margin:0px;\"><img src=\"images/'+picId+'\-big.jpg\" height=\"450\" onclick=\"window.close();\"></body>');
  pop.document.close(); 
}
</script>

BODY:
<img src="images/2.jpg" border="0" onClick="imagePop(2);"><BODY>
Avatar billede thanatos Nybegynder
14. januar 2005 - 13:19 #8
Prefekt! Det virker prefekt og glidesfrit - så jeg skal bare tilføje forskellen mellem Netscape og Explorer, og det gør jeg senere, det vigtigste er at det virker - mange tak for hjælpen!
Avatar billede thomas_yde Nybegynder
14. januar 2005 - 13:24 #9
Det var så lidt.
Tak for point :)
Avatar billede thomas_yde Nybegynder
14. januar 2005 - 13:25 #10
Hvis du skal lave det lidt mere sexet så tilføj denne linje efter pop.documenent.close();
pop.focus();
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