/ Forside / Teknologi / Udvikling / Java Scripts / Nyhedsindlæg
Login
Glemt dit kodeord?
Brugernavn

Kodeord


Reklame
Top 10 brugere
Java Scripts
#NavnPoint
molokyle 5410
Klaudi 2799
smorch 2439
kim 1360
Harlekin 1134
bentjuul 984
gibson 800
severino 695
Random 675
10  konsulent.. 626
Ændring af billedstørrelse
Fra : Carsten Suurland


Dato : 06-02-03 12:44

Hej NG

Jeg har lavet en side til fremvisning af billeder.
En liste indeholder filnavne og ved klik på et filnavn skal det tilhørnde
billede vises.

Billeder må maks vises i 200 * 200 pixels. Er billedet større skal det
skaleres.

Mit problem:
Det ser ud til, at størrelsen på mine billeder kun aflæses korrekt første
gang...
Efterfølgende huskes størrelsen på det første billede, hvilket betyder at
efterfølgende billeder skaleres forkert.

Koden vedlægges... Er der en guru der kan se hvad problemet er?
N.B. Der er kun meningen at det skal fungere i IE...

'************************************************
function updateImage() {
var src = document.getElementById('lstFiles');
var selectedImage = new String(src.options[src.selectedIndex].text);
document.getElementById('imgPreview').src = '../images/clipart/' +
selectedImage;

var h;
var w;

h = document.getElementById('imgPreview').height;
w = document.getElementById('imgPreview').width;

// show image dimensions below image
document.getElementById('dimensions').innerText = h.toString() + '
pixels * ' + w.toString() + ' pixels';

var ratio;

if(h > w) {
if(h > 200) {
// height larger than 200 pixels
ratio = int(200 / h);
h = 200;
w = w * ratio; }
}
else if(w > h) {
if(w > 200) {
// width larger than 200 pixels
ratio = int(200 / w);
w = 200;
h = h * ratio; }
}
else {
if(h > 200) {
// height and width larger than 200 pixels
ratio = int(200 / h);
h = 200;
w = 200; }
}

document.getElementById('imgPreview').height = h;
document.getElementById('imgPreview').width = w;
}
'************************************************

/Carsten Suurland



 
 
Hintzmann (06-02-2003)
Kommentar
Fra : Hintzmann


Dato : 06-02-03 13:22

"Carsten Suurland" <removethiscarsten@suurland.dk> skrev i en meddelelse
news:b1thpb$2s59$1@news.cybercity.dk...
> Hej NG
>
> Jeg har lavet en side til fremvisning af billeder.
> En liste indeholder filnavne og ved klik på et filnavn skal det tilhørnde
> billede vises.
>
> Billeder må maks vises i 200 * 200 pixels. Er billedet større skal det
> skaleres.
>
> Mit problem:
> Det ser ud til, at størrelsen på mine billeder kun aflæses korrekt første
> gang...
> Efterfølgende huskes størrelsen på det første billede, hvilket betyder at
> efterfølgende billeder skaleres forkert.
>
> Koden vedlægges... Er der en guru der kan se hvad problemet er?
> N.B. Der er kun meningen at det skal fungere i IE...
>
Hej Carsten

I din kode sætter du sourcen på billedet og spørge få linier efter på width
og height på billedet.
Den går ikke... Hva' nu hvis billedet fylder flere Mb.
JavaScriptet er færdigt langt før billedet er hentet.

Det du kan gøre er at hente billedet midlertidigt ind i et Image object.
(Eller et skjult billede - Billede sat til display:none;)
Du kan så spørge med et bestemt interval på om billedet er hentet.
Det kan også være at du kan sætte eventen onload på Image objectet, som
køres når det er hentet.

Når billedet er hentet køre du din skalerings funktion.

Held og lykke

Hintzmann



Carsten Suurland (06-02-2003)
Kommentar
Fra : Carsten Suurland


Dato : 06-02-03 14:40

Hej Hintzmann

Tak for hintet!
Jeg kigger på complete egenskaben på et img objekt...

/Carsten



Carsten Suurland (06-02-2003)
Kommentar
Fra : Carsten Suurland


Dato : 06-02-03 14:46

Hej NG

Jeg løste problemet ved at oprette en scriptblok der reagerede på img's
onreadystatechange event.

/Carsten Suurland



Carsten Suurland (06-02-2003)
Kommentar
Fra : Carsten Suurland


Dato : 06-02-03 14:49

og dog...

Jeg får stadig højde og bredde for det allerførste billede der blev
loaded...

/Carsten

"Carsten Suurland" <removethiscarsten@suurland.dk> wrote in message
news:b1toss$1qg$1@news.cybercity.dk...
> Hej NG
>
> Jeg løste problemet ved at oprette en scriptblok der reagerede på img's
> onreadystatechange event.
>
> /Carsten Suurland
>
>



Hintzmann (06-02-2003)
Kommentar
Fra : Hintzmann


Dato : 06-02-03 15:16

"Carsten Suurland" <removethiscarsten@suurland.dk> skrev i en meddelelse
news:b1tp3i$1t5$1@news.cybercity.dk...
> og dog...
>
> Jeg får stadig højde og bredde for det allerførste billede der blev
> loaded...

- Har du mulighed for at lave et online eksempel ?

Hintzmann



Carsten Suurland (06-02-2003)
Kommentar
Fra : Carsten Suurland


Dato : 06-02-03 15:20

ikke lige p.t. desværre

"Hintzmann" <nospam@please.dk> wrote in message
news:b1tqme$3uh$1@sunsite.dk...
> "Carsten Suurland" <removethiscarsten@suurland.dk> skrev i en meddelelse
> news:b1tp3i$1t5$1@news.cybercity.dk...
> > og dog...
> >
> > Jeg får stadig højde og bredde for det allerførste billede der blev
> > loaded...
>
> - Har du mulighed for at lave et online eksempel ?
>
> Hintzmann
>
>



Lasse Reichstein Nie~ (06-02-2003)
Kommentar
Fra : Lasse Reichstein Nie~


Dato : 06-02-03 13:27

"Carsten Suurland" <removethiscarsten@suurland.dk> writes:

> Mit problem:
> Det ser ud til, at størrelsen på mine billeder kun aflæses korrekt første
> gang...
> Efterfølgende huskes størrelsen på det første billede, hvilket betyder at
> efterfølgende billeder skaleres forkert.
>
> Koden vedlægges... Er der en guru der kan se hvad problemet er?
> N.B. Der er kun meningen at det skal fungere i IE...


> h = document.getElementById('imgPreview').height;
> w = document.getElementById('imgPreview').width;

Jeg ved ikke præcist hvad height og width aflæser, men jeg regner med
at det er elementets højde og bredde, ikke billedets. Efter at du
første gang har sat højde og bredde på elementet, så ændrer det sig
ikke bare fordi du skifter billedet ud.

Hmm, men en test siger at det ikke passer. Det virker for mig i
IE6.

Jeg antager at imgPreview er et img-element.

Kan problemet være at billedet ikke er loadet endnu? Fra du skriver
blah.src="..." til billedet er hentet og cachet kan der godt gå lidt
tid.

Jeg kan også set, at *nogle gange*, så opfatter IE ikke størrelsen af det
billede man loader, og andre gange gør den.

Hvis jeg loader et billede
x.src="http://www.infimum.dk/privat/PicA.png"
så skifter størrelsen på img-elementet. Hvis jeg loader det samme billede
på en anden måde
x.src="http://www.infimum.dk/privat/PicA.png?"
(bemærk ?'et til sidst), så skifter elementet *ikke* størrelse.
Det giver ca. zip mening!

Prøv evt. at lave et nyt billed-element.

var newimg = new Image();
newimg.src=" ... ";
// vent på at billedet er loadet, ved ikke helt hvordan man gør det
h = newimg.height;
w = newimg.width;

Hvis du i forvejen preloader dine billeder, så kan du sørge for at
gemme dem så du kan slå deres størrelse op.
Det kan være det hjælper (krydse-fingre etc, det her er ren sort magi)

/L
--
Lasse Reichstein Nielsen - lrn@brics.dk
Ph.D. i datalogi søger stilling som software-udvikler i Øst- eller
Nordjylland. Curriculum Vitae: <URL:http://www.brics.dk/~lrn/cv.html>

Carsten Suurland (06-02-2003)
Kommentar
Fra : Carsten Suurland


Dato : 06-02-03 17:49

Har fundet en løsning...

Jeg har oprettet et skjult billede...
<img ... style="visibility: hidden;">

Dette bille opdaterer jeg, når brugeren vælger et billede fra min liste.
Når det skjulte billedes onreadystatechange event fyres af, så opdaterer jeg
det egentlige billede... så virker det.

/Carsten



Søg
Reklame
Statistik
Spørgsmål : 177552
Tips : 31968
Nyheder : 719565
Indlæg : 6408847
Brugere : 218887

Månedens bedste
Årets bedste
Sidste års bedste