Hi everyone,<div><br></div><div>I am trying to animate the growth of some divs which I have positioned according to lon lat values on the map (like markers but more complex and more flexible for css manipulation). I want them to grow as a user zooms.</div>
<div><br></div><div>I want to animate them using css transitions but these transitions should not be applied on panning or dragging. I am therefore injecting the transition styles into the <head> before changing the size of my divs and then removing them again after. This works and performs well. The problem is that I am using the 'zoomend' event and this causes the animation to start AFTER the map (and all the 'marker' elements) have already moved. For the effect I want to achieve I need to be able to activate the transitions before the map moves so that the elements move smoothly appart.<br>
<div><br></div><div><b>So.... Why is there not a 'zoomstart' event? And seeing as there is no event triggered ONLY for the start of a zoom (movestart is triggered for pan and drag too) can you think of any way to trigger a function at this time?</b></div>
<div><br></div><div>Any help would be really appreciated :) </div><div><div><br></div>-- <br>Dean Fischer<div><br></div><div><img src="http://www.maptia.com/themes/precision/css/images/dean-signature.png"></div><div><div>
<div><br><div>Co-founder at <a href="http://www.maptia.com" target="_blank">Maptia</a></div><div><br></div><div>Twitter <a href="http://www.twitter.com/deanfisch" target="_blank">@deanfisch</a></div><div>LinkedIn <a href="http://cl.linkedin.com/pub/dean-fischer/48/6a7/41b" target="_blank">deanfischer</a></div>
<div>Skype dkfischer1</div><div><br></div><div>You can follow Maptia here</div><div><br></div><div><a href="http://www.facebook.com/maptia" target="_blank"><img src="http://www.maptia.com/themes/precision/css/images/facebook_share.png"></a> <a href="http://www.twitter.com/maptia" target="_blank"><img src="http://www.maptia.com/themes/precision/css/images/twitter_share.png"></a></div>
<div><br></div></div></div></div><br>
</div></div>