Demo of data-rel-position

This demo use data-rel-position="relative"
and data-rel-rotate-x/y/z
to easy 3D positioning of slides.

Front

There's two nested box here.

Inside Front
Inside Right
Right
Back
Inside Back
Inside Top
Top
Left
Inside Left
Inside Bottom
Bottom

Slide one

This is a ring of 8 slides.

It's easy constucted with data-rel-position="relative" without calculates the coordinates of all slides.

Slide two

The position of this slide is calculated as relatived position and rotation of the first slide.

The following slides don't need to set any position attributes, they are inherit from this slide.

Slide three

Slide four

Slide five

Slide six

Slide seven

Slide eight

Slide one

This is another ring of slides.

Except for the this slide, its code is just cloned from the yellow ring.

Just change the position of first slide, all the following slides are position relatived to it.

Slide two

Slide three

Slide four

Slide five

Slide six

Slide seven

Slide eight