mboost-dp1
javascript: dynamisk billedskalering
Halløj
Jeg leder efter et javascript der nedskalerer et billede hvis de er over en hvis størrelse. Når man trykker på billedet skal det vises i originalstørrelsen.
Noget a la det her:
http://img163.imagevenue.com/img.php?image=45627_f...
Jeg har prøvet blot at stjæle scriptet, men det virker ikke i IE på min testside - http://ronson.dk/gallery/
Jeg leder efter et javascript der nedskalerer et billede hvis de er over en hvis størrelse. Når man trykker på billedet skal det vises i originalstørrelsen.
Noget a la det her:
http://img163.imagevenue.com/img.php?image=45627_f...
Jeg har prøvet blot at stjæle scriptet, men det virker ikke i IE på min testside - http://ronson.dk/gallery/
Noget i stil med:
<img src="rmlogo.jpg" name="billedet" onclick="if(this.width != originalsize)this.width = originalsize;else this.width = 100">
<script>
var originalsize = document.billedet.width;
if(originalsize>100)document.billedet.width = 100;
</script>
Jeg har bare valgt 100 som maksimalstørrelse...
<img src="rmlogo.jpg" name="billedet" onclick="if(this.width != originalsize)this.width = originalsize;else this.width = 100">
<script>
var originalsize = document.billedet.width;
if(originalsize>100)document.billedet.width = 100;
</script>
Jeg har bare valgt 100 som maksimalstørrelse...
#3
Det er et virkende eksembel, og jeg har testet det i både IE og FF og det virker for mig begge steder. Hvad er det der ikke virker?
Muligvis virker denne bedre:
<script>
function size(){
var originalsize = document.billedet.width;
if(originalsize>100)document.billedet.width = 100;
}
</script>
</head>
<body onload="size()">
<img src="rmlogo.jpg" name="billedet" onclick="if(this.width != originalsize)this.width = originalsize;else this.width = 100">
Det er et virkende eksembel, og jeg har testet det i både IE og FF og det virker for mig begge steder. Hvad er det der ikke virker?
Muligvis virker denne bedre:
<script>
function size(){
var originalsize = document.billedet.width;
if(originalsize>100)document.billedet.width = 100;
}
</script>
</head>
<body onload="size()">
<img src="rmlogo.jpg" name="billedet" onclick="if(this.width != originalsize)this.width = originalsize;else this.width = 100">
Rettelse, dette er den optimale:
<script>
function size(){
if(originalsize>100)document.billedet.width = 100;
}
</script>
</head>
<body onload="size()">
<img src="rmlogo.jpg" name="billedet" onload="var originalsize = this.width;
" onclick="if(this.width != originalsize)this.width = originalsize;else this.width = 100">
<script>
function size(){
if(originalsize>100)document.billedet.width = 100;
}
</script>
</head>
<body onload="size()">
<img src="rmlogo.jpg" name="billedet" onload="var originalsize = this.width;
" onclick="if(this.width != originalsize)this.width = originalsize;else this.width = 100">
De er prøvet og smidt op på siden, det er der de er testet
Din sidste kode er netop smidt op, men virker heller ikke :/
Jeg tror da jeg har brugt det rigtigt
http://ronson.dk/gallery/chart.png
Din sidste kode er netop smidt op, men virker heller ikke :/
Jeg tror da jeg har brugt det rigtigt
http://ronson.dk/gallery/chart.png
Det forstår jeg ikke. Den virker fint både på min computer og min server. Den eneste forskel der er er at jeg ikke skriver "onload='var orig..." men bare "onload='orig...", men det skulle da ikke være nok til at den ikke virkede.
Prøv lige at se om det virker på PLWD. Det er præcist den samme kode.
Prøv lige at se om det virker på PLWD. Det er præcist den samme kode.
Hvis jeg var dig ville jeg nok lave/finde en ASP.NET/PHP-løsning der skalerer billederne for dig automatisk. Det er en bedre løsning på sigt, hvis du har med forholdvis tunge billeder at gøre. Billederne bliver jo ikke mindre rent pladsmæssigt af at du skalerer dem med javascript ;)
#7: Jeg tror det har noget med at gøre at min side er en XHTML side, og browserne derfor ikke kan li' javasciptet.
#8: Sjovt du nævner det, hvordan tror du de thumbnails havner på forsiden? :)
Og ja, bare rolig, jeg gemmer dem første gang de genereres, så det ikke skal gøres igen.
Men min ide var at når man vil se billedet i fuld størrelse, altså klikker på en thumbnail, så skal man kunne klikke billedet stort og lille. Det skal ikke sendes resizet fra serveren.
#8: Sjovt du nævner det, hvordan tror du de thumbnails havner på forsiden? :)
Og ja, bare rolig, jeg gemmer dem første gang de genereres, så det ikke skal gøres igen.
Men min ide var at når man vil se billedet i fuld størrelse, altså klikker på en thumbnail, så skal man kunne klikke billedet stort og lille. Det skal ikke sendes resizet fra serveren.
Der var ikke andet at gøre end at erstatte
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
med
<html>
Trist men sandt.
Kunne selvfølgelig også rode med at gøre javascriptet kørbart i xhtml, men hvor sjovt er det (sikkert meget sjovt).
Btw, Victoria Secret.jpg = lækkert kvalitet!
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
med
<html>
Trist men sandt.
Kunne selvfølgelig også rode med at gøre javascriptet kørbart i xhtml, men hvor sjovt er det (sikkert meget sjovt).
Btw, Victoria Secret.jpg = lækkert kvalitet!
Gå til top
Opret dig som bruger i dag
Det er gratis, og du binder dig ikke til noget.
Når du er oprettet som bruger, får du adgang til en lang række af sidens andre muligheder, såsom at udforme siden efter eget ønske og deltage i diskussionerne.
- Forside
- ⟨
- Forum
- ⟨
- Programmering
Gå til bund