[JS] dynamische grootte images en IE security - Softwareontwikkeling

vrijdag 29 juni 2007 15:49

Acties:

Topicstarter

Ik heb een scriptje gemaakt wat na het laden van de pagina 1 afbeelding verkleint naar een maximale breedte, of hoogte, afhankelijk van de verhouding.
Tevens nog een scriptje, wat de afbeelding op ware grootte in een popupje toont, zodra je erop klikt.

In firefox werkt dit helemaal naar m'n zin, alleen in IE krijg ik een security melding en wordt de afbeelding gewoon op ware grootte weergegeven en de popup werkt ook niet. Pas als ik de 'blocked content' toesta werkt het script naar behoren.

Weet iemand of dit op een andere manier te doen is?
Ik zat zelf te denken om de goede hoogte en breedte van het plaatje berekenen, vóórdat de pagina naar de browser gestuurd wordt, zodat IE er niet over struikelt. Maar dat kan zeker niet met javascript?

vrijdag 29 juni 2007 15:58

Acties:

Verwijderd

Kun je een voorbeeld geven of een link naar je code?

Verder heb ik hier ook hinder door ondervonden, FF ondersteunt de method resizeToContent() en IE niet. De enige cross-browser method is resizeTo(x,y) en dan pakt hij niet de viewport maar het hele scherm waardoor je weer pixels mist van je foto.

Maarja probeer iets meer te vertellen.

vrijdag 29 juni 2007 16:13

Acties:

Rene59

Topicstarter

Hier het testscriptje:

code:

<html>

<script language="javascript" type="text/javascript">

    function resizetestImg() {
        var iWidth = document.images['testImg'].width;
        var iHeight = document.images['testImg'].height;
        if (iWidth > iHeight) {
            iHeight = Math.round(iHeight / (iWidth/160));
            iWidth = 160;
        } else {
            iWidth = Math.round(iWidth / (iHeight/160));
            iHeight = 160;
        }
        document.images['testImg'].width = iWidth;
        document.images['testImg'].height = iHeight;
    }

</script>

<body>

<img name="testImg" border="0" src="http://www.link.naar/plaatje.gif">

<script language="javascript" type="text/javascript">
    resizetestImg();
</script>

</body>
</html>

vrijdag 29 juni 2007 16:21

Acties:

GregoryBE

Deze code doet een resize op alle afbeeldingen op heel de pagina automatisch.

JavaScript:

<script> 

window.onload = resizeimg; 
function resizeimg() 
{ 
   if (document.getElementsByTagName) 
   { 
      for (i=2; i<document.getElementsByTagName('img').length; i++) 
      { 
         im = document.getElementsByTagName('img')[i]; 
         if (im.width > 780) 
         { 
            im.style.width = '780px';  
         } 
      } 
   } 
} 


</script>

It's just a matter of time...

vrijdag 29 juni 2007 16:32

Acties:

Rene59

Topicstarter

@GregoryBE: bedankt, met onLoad werkt het ook goed in IE.

[ Voor 128% gewijzigd door Rene59 op 29-06-2007 16:33 ]