Linda wrote:
> Am I on the right track?
>
A few suggestions, below...
> <html>
> <head>
> <script type="text/javascript">
> function shrink() {
> box = document.getElementById( "box" );
> var old_width = box.offsetWidth;
> box.style.width = old_width * .000001;
> }
> </script>
>
> <style type="text/css">
> div#box
> {
> background-color: blue;
> display: block;
> position: absolute;
> width: 320;
> height: 480;
> -webkit-transition-property: ease;
> -webkit-transition-duration: 0.5s;
> -webkit-transition-timing-function: default;
> }
> </style>
> </head>
> <body>
> <div id="box" onclick="shrink();"></div>
> </body>
> </html>
>
1) Add units of 'px' after width and height (including where you set it)
2) Avoid floating point numbers for width
3) -webkit-transition-property should be set to 'width' (the property
you want to animate)
4) animating 'width' should work, but if you use a 'scale'
transformation it may get HW acceleration on iPhone
-- Sean
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"iPhoneWebDev" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/iphonewebdev?hl=en
-~----------~----~----~----~------~----~------~--~---
