Jump to content


Apple slider

how to?

  • Please log in to reply
2 replies to this topic

#1 Guth


    Alba Gu Bráth

  • Joined: 30-December 05
  • Location: Scotland
  • OS: Windows 8 Pro
  • Phone: Nokia Lumia

Posted 08 January 2013 - 01:16

I just stumbled accross the apple page for the iPad case and they have this cool animation where you click and drag and the case rolls off and under the iPad.

Looking at the source, each frame of the animation is a different picture.

How have they done this? Its very cool and backward compatible.

Forgot link :laugh: http://www.apple.com/ipad/accessories/

#2 +Nik L

Nik L

    Where's my pants?

  • Tech Issues Solved: 5
  • Joined: 14-January 03

Posted 08 January 2013 - 01:36


On drag, get left co-ord of mouse from left of container.

Say this goes from 0 to 150, have 150 images in a strip. Set the offset vertically to the value of the co-ord?

Edit: I see they are doing it with individual images. So load image + "x value" + .jpg

#3 Cute James

Cute James


  • Joined: 14-June 11
  • Location: Hamamatsu, Japan

Posted 08 January 2013 - 01:50

I thought they were perhaps using separate PNGs for the cover and iPad in order to achieve transparency, so was wondering about the network overhead/filesize for each frame.

However, now I realise that JPEGs are being used, allowing the faster load time.

Quite a cool effect, although wouldn't a sprite file have been a better choice instead of individual frames?