The new %%flip and %%flop Haddock Styles allow to add front/back flipping animation.

Flip Horizontal#

%%flip
!Front
----
!Back
/%

Front#

This is just a sample.

Back#

This is is just some sample. Don’t even bother reading it; you will just waste your time. Why do you keep reading? Do I have to use Lorem Ipsum to stop you? OK, here goes: Lorem ipsum dolor sit amet, consectetur adipi sicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Still reading? Gosh, you’re impossible. I’ll stop here to spare you.

Flop Vertical #

%%flop
!Front
----
!Back
/%

Front#

This is just a sample.


Back#

This is is just some sample. Don’t even bother reading it; you will just waste your time. Why do you keep reading? Do I have to use Lorem Ipsum to stop you? OK, here goes: Lorem ipsum dolor sit amet, consectetur adipi sicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Still reading? Gosh, you’re impossible. I’ll stop here to spare you.

Parameters#

height (h<integer>)
height in pixel (default is 150px)
width (w<integer>)
width in pixel (default is 100%)
front style
style of the front panel none, default, info, success, warning, danger, error
back style
style of the back panel (same values as front panel)
%%flop-h48-w240-info-danger
!Front panel
----
!Back panel
/%

Front panel#


Back panel#

%%flip-h48-w240-none-none
%%(background:red;padding:.5em;)
Front panel 
/%
----
%%(background:yellow;padding:.5em;)
Back panel 
/%
/%

Front panel

Back panel