1

If you see the video over here: http://msdn.microsoft.com/en-us/library/windows/apps/br212680.aspx, you will notice that the 2nd tile scales down immediately, stays scaled-down for few milliseconds then comes up to normal state.

I tried to mimic this behaviour by reducing the width and height by 2px on :active and gave background-size: cover. But I am not able to create the delay in scaling back to normal with this approach.

This should be possible with CSS3 animations but I am not able to map out an approach. Can anyone give me a direction to go from here?

EDIT: Here's a jsfiddle of what I have tried: http://jsfiddle.net/p3Wbh/

** EDIT: **: Updated the jsfiddle: http://jsfiddle.net/p3Wbh/1/ with jQuery implementation for the "held down" effect. Looking for a way to do this in css3.

4

1 回答 1

0

由于您正在寻找 javascript / winJS，我可以解释它......但是我不知道 css3 属性..

请通过 Gestures 链接进行自我介绍 Gestures

这里使用 1 -> MSPointerDown 2 -> MSPointerUp 3 -> MSPointerOver 4 -> MSPointerOut

通过在这些事件中设置 css 属性为您的磁贴设置动画.. :) 我希望这对您有用.....

就像在指针向下添加您为按下的外观编写的 css 并在指针向上或移动中添加动画 + css 以获得未按下的外观......

希望建议有帮助:)

于 2013-09-04T12:22:05.967 回答