Everyone is familiar with the rotating featured posts that have become so popular recently. About 6 months ago I was working on a project that needed one that would just show categories and artwork, but would expand to show the teaser when clicked. We ended up going an entirely different direction but I figured I might as well post the script and maybe someone will get some use out of it.
Keep in mind that this is a really rough version that was only intended for demonstration. Really it’s barely more than proof of concept, but I don’t think it would take much to clean up. I haven’t done any testing and I can’t offer any support, just take it and have fun. I would like to give a lot of the credit to Remy Sharp and his jQuery Infinite Carousel script which this is based on. 90% of the credit for this goes to him.
Source Code
jQuery Flyout Carousel Demo (Click Image/header to expand and contract)
-
Iron Man

Real Name: Tony Stark
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum facilisis vestibulum lorem. Donec nisi mauris, eleifend ut sagittis sit amet, rhoncus et risus. Etiam leo tortor, interdum vel suscipit vel, vestibulum sed nibh. Aenean auctor sem a dolor condimentum at cursus tellus malesuada.
Image © ~caicacau
-
Batman

Real Name: Bruce Wayne
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum facilisis vestibulum lorem. Donec nisi mauris, eleifend ut sagittis sit amet, rhoncus et risus. Etiam leo tortor, interdum vel suscipit vel, vestibulum sed nibh. Aenean auctor sem a dolor condimentum at cursus tellus malesuada.
Image © ~BlondeTheColorist
-
Psylocke

Real Name: Elizabeth Braddock
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum facilisis vestibulum lorem. Donec nisi mauris, eleifend ut sagittis sit amet, rhoncus et risus. Etiam leo tortor, interdum vel suscipit vel, vestibulum sed nibh. Aenean auctor sem a dolor condimentum at cursus tellus malesuada.
Image © ~earache-J
-
Wolverine

Real Name: James Howlett
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum facilisis vestibulum lorem. Donec nisi mauris, eleifend ut sagittis sit amet, rhoncus et risus. Etiam leo tortor, interdum vel suscipit vel, vestibulum sed nibh. Aenean auctor sem a dolor condimentum at cursus tellus malesuada.
Image © ~DashMartin
-
Catwoman

Real Name: Selina Kyle
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum facilisis vestibulum lorem. Donec nisi mauris, eleifend ut sagittis sit amet, rhoncus et risus. Etiam leo tortor, interdum vel suscipit vel, vestibulum sed nibh. Aenean auctor sem a dolor condimentum at cursus tellus malesuada.
Image © ~rhoogers
-
the Hulk

Real Name: Bruce Banner
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum facilisis vestibulum lorem. Donec nisi mauris, eleifend ut sagittis sit amet, rhoncus et risus. Etiam leo tortor, interdum vel suscipit vel, vestibulum sed nibh. Aenean auctor sem a dolor condimentum at cursus tellus malesuada.
Image © ~KEGO44
-
Tank Girl

Real Name: No idea
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum facilisis vestibulum lorem. Donec nisi mauris, eleifend ut sagittis sit amet, rhoncus et risus. Etiam leo tortor, interdum vel suscipit vel, vestibulum sed nibh. Aenean auctor sem a dolor condimentum at cursus tellus malesuada.
Image © ~MonkeySeed
-
Shadowcat

Real Name: Anne “Kitty” Pride
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum facilisis vestibulum lorem. Donec nisi mauris, eleifend ut sagittis sit amet, rhoncus et risus. Etiam leo tortor, interdum vel suscipit vel, vestibulum sed nibh. Aenean auctor sem a dolor condimentum at cursus tellus malesuada.
Image © ~windriderx23
-
Spawn

Real Name: Al Simmons
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum facilisis vestibulum lorem. Donec nisi mauris, eleifend ut sagittis sit amet, rhoncus et risus. Etiam leo tortor, interdum vel suscipit vel, vestibulum sed nibh. Aenean auctor sem a dolor condimentum at cursus tellus malesuada.
Image © ~Alentrix