zoom centreren in javascript

Status
Niet open voor verdere reacties.

pietjepuk3

Nieuwe gebruiker
Lid geworden
16 jan 2008
Berichten
2
Het probleem is het volgende
Ik heb een foto van een gevel op de pagina gecentreerd. Als ik op een link klik wil ik dat de foto ingezoomd wordt totop een zeker niveau (alsof ik binnenvlieg in de deur die in het midden zit).
Daarna moet er een volgende pagina opengaan.
Ik kan wel inzoomen maar de foto blijft niet gecentreerd. De linkerbovenhoek blijft staan en de foto vergroot enkel rechts en onder.
Kan er iemand mij hiervoor een scriptje bezorgen aub

Thx
 
Laatst bewerkt:
Misschien heb je hier iets aan:
PHP:
<script type="text/javascript">
 // Egel 080121 ;)
 function zoomTo(obj,w,h,url) {
  var inc = 20, tm = 200;
  var w0 = parseInt(obj.style.width),  wi = (w - w0) / inc, x = parseInt(obj.style.marginLeft) + w0 / 2;
  var h0 = parseInt(obj.style.height), hi = (h - h0) / inc, y = parseInt(obj.style.marginTop)  + h0 / 2;
  var c = 0;
  var interval = window.setInterval(
   function () {
    c++;
    if (c > inc) { 
     window.clearInterval(interval);
     if (url) location.href = url;
     };
    w = (c * wi + w0);
    h = (c * hi + h0);
    obj.style.width = w + 'px',
    obj.style.height = h + 'px',
    obj.style.marginLeft = x - w / 2 + 'px';
    obj.style.marginTop = y - h / 2 + 'px';
    }
   ,tm);
  };
</script>


<img src="gevel.jpg" style="margin-left: 200px; margin-top: 150px; width: 400px; height: 300px;" onclick="zoomTo(this,800,600,'volgende_pagina.html')">
Het centreren gebeurt door de top- en left-margin aan te passen tijdens het zoomen. :)

var inc = 20, tm = 200; zijn het aantal stappen en de tijd ertussen (in milliseconden).


Vr.Gr. Egel.
 
zoom centreren

fantastisch gevonden Egel
Het zet mij een heel eind op weg
De zoom werkt perfect

De image wordt wel nog steeds op een bepaalde plaats gezet nl op 200/150
Wat ik het liefst zou hebben is dat de image gecentreerd wordt via middle en center in bv dreamweaver
Hierdoor staat mijn image altijd in het midden ongeacht de ingestelde resolutie van de eindgebruiker van de pagina
if you snap what I mean

Toch alvast bedankt

Pietje Puk
 
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan