WP UI CSS3 Styles demo

Below is a demo of all the custom CSS3 styles bundled with WP UI plugin for wordpress. Select the style from the checkbox and it will be applied to the tabs, accordion and sliders.

All the available jQuery UI themes can be found at jQuery UI gallery

Please post support questions at Forums. This site is purely meant for demonstration, documentation and reference purposes. Thanks!

Tab 1


Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc faucibus malesuada aliquam. Donec in nulla sed orci posuere consectetur nec ac orci. Curabitur et eros nisi. Proin tincidunt lacus a erat hendrerit at facilisis nisi euismod. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Morbi vulputate, massa eget tristique sodales, tellus dui eleifend risus, ac suscipit elit eros nec risus. Suspendisse blandit, odio non mattis vestibulum, dui quam ultricies lorem, ut cursus tellus dolor ut tortor. Etiam id enim arcu. Aliquam viverra bibendum sapien, vestibulum elementum nulla consequat quis. Praesent at leo nec enim ultricies porta.


Tab 2


Etiam id metus nulla. Nullam posuere interdum eros nec convallis. Integer nibh metus, auctor nec bibendum quis, sagittis nec purus. Proin tristique magna non ipsum ultricies lacinia rutrum est porta. Sed ornare condimentum arcu, ac adipiscing erat posuere nec. Integer ligula ligula, iaculis at rutrum sed, hendrerit sed odio. Pellentesque ac massa ac elit volutpat molestie non a quam. Curabitur iaculis ornare nibh, ac sollicitudin sapien placerat id. Fusce sem arcu, mollis ac egestas at, venenatis posuere nulla. Fusce tempus sagittis enim, sit amet aliquet nulla placerat a. Nam lacus nisi, adipiscing in laoreet at, porttitor et velit. Nunc et nulla eros. Donec quis felis quis leo molestie scelerisque. Nullam laoreet justo eget nisi molestie eget aliquet sem lobortis.


Tab 3


Nulla facilisi. Aliquam in metus cursus ante luctus semper. Nullam iaculis massa justo. Morbi rhoncus libero nec arcu blandit ac porttitor ipsum iaculis. Fusce tristique, enim sit amet ultricies porttitor, velit nisl tempor lorem, non blandit mauris lectus faucibus mi. Phasellus cursus mauris eu elit feugiat vel scelerisque risus pellentesque. Phasellus posuere tortor non nisi ornare at facilisis metus suscipit. Donec massa magna, condimentum a dapibus non, egestas ut nunc. Sed faucibus, augue in posuere dapibus, elit lorem vulputate velit, nec molestie dui purus vel lectus. Ut nec mi et leo imperdiet volutpat. Donec vestibulum, urna vitae blandit feugiat, mauris purus hendrerit diam, sit amet gravida nulla sem vitae ante. Morbi pellentesque leo et quam mattis sagittis sed et tellus. Mauris at orci tellus.


Accordions


Tab 1


Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc faucibus malesuada aliquam. Donec in nulla sed orci posuere consectetur nec ac orci. Curabitur et eros nisi. Proin tincidunt lacus a erat hendrerit at facilisis nisi euismod. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Morbi vulputate, massa eget tristique sodales, tellus dui eleifend risus, ac suscipit elit eros nec risus. Suspendisse blandit, odio non mattis vestibulum, dui quam ultricies lorem, ut cursus tellus dolor ut tortor. Etiam id enim arcu. Aliquam viverra bibendum sapien, vestibulum elementum nulla consequat quis. Praesent at leo nec enim ultricies porta.


Tab 2


Etiam id metus nulla. Nullam posuere interdum eros nec convallis. Integer nibh metus, auctor nec bibendum quis, sagittis nec purus. Proin tristique magna non ipsum ultricies lacinia rutrum est porta. Sed ornare condimentum arcu, ac adipiscing erat posuere nec. Integer ligula ligula, iaculis at rutrum sed, hendrerit sed odio. Pellentesque ac massa ac elit volutpat molestie non a quam. Curabitur iaculis ornare nibh, ac sollicitudin sapien placerat id. Fusce sem arcu, mollis ac egestas at, venenatis posuere nulla. Fusce tempus sagittis enim, sit amet aliquet nulla placerat a. Nam lacus nisi, adipiscing in laoreet at, porttitor et velit. Nunc et nulla eros. Donec quis felis quis leo molestie scelerisque. Nullam laoreet justo eget nisi molestie eget aliquet sem lobortis.


Tab 3


Nulla facilisi. Aliquam in metus cursus ante luctus semper. Nullam iaculis massa justo. Morbi rhoncus libero nec arcu blandit ac porttitor ipsum iaculis. Fusce tristique, enim sit amet ultricies porttitor, velit nisl tempor lorem, non blandit mauris lectus faucibus mi. Phasellus cursus mauris eu elit feugiat vel scelerisque risus pellentesque. Phasellus posuere tortor non nisi ornare at facilisis metus suscipit. Donec massa magna, condimentum a dapibus non, egestas ut nunc. Sed faucibus, augue in posuere dapibus, elit lorem vulputate velit, nec molestie dui purus vel lectus. Ut nec mi et leo imperdiet volutpat. Donec vestibulum, urna vitae blandit feugiat, mauris purus hendrerit diam, sit amet gravida nulla sem vitae ante. Morbi pellentesque leo et quam mattis sagittis sed et tellus. Mauris at orci tellus.


Sliders

Super secret content

Nulla facilisi. Aliquam in metus cursus ante luctus semper. Nullam iaculis massa justo. Morbi rhoncus libero nec arcu blandit ac porttitor ipsum iaculis. Fusce tristique, enim sit amet ultricies porttitor, velit nisl tempor lorem, non blandit mauris lectus faucibus mi. Phasellus cursus mauris eu elit feugiat vel scelerisque risus pellentesque. Phasellus posuere tortor non nisi ornare at facilisis metus suscipit. Donec massa magna, condimentum a dapibus non, egestas ut nunc. Sed faucibus, augue in posuere dapibus, elit lorem vulputate velit, nec molestie dui purus vel lectus. Ut nec mi et leo imperdiet volutpat. Donec vestibulum, urna vitae blandit feugiat, mauris purus hendrerit diam, sit amet gravida nulla sem vitae ante. Morbi pellentesque leo et quam mattis sagittis sed et tellus. Mauris at orci tellus.

Collapsibles

Pane 1

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sapien metus, facilisis vitae sagittis ac, pretium sed nisl. Curabitur porta dui sed nisl posuere id posuere quam rhoncus. Sed a elit sit amet ligula adipiscing laoreet nec id turpis. Proin faucibus mollis est ut aliquet. Integer gravida auctor quam vel sodales. Maecenas augue erat, egestas et suscipit at, accumsan facilisis velit. Nulla ut ante libero. Suspendisse quis lorem viverra risus posuere blandit malesuada tristique massa. Mauris blandit, orci eget ornare fringilla, felis justo lacinia purus, id mattis velit orci vel odio. Proin sodales facilisis malesuada. Aliquam erat volutpat. Morbi a ligula eget felis fermentum euismod at sit amet lectus.

Pane 2

Nullam suscipit tempor augue sodales viverra. Duis at fringilla erat. Donec quis sapien non justo molestie porttitor. Nullam ac neque est, pellentesque mattis dui. Nulla lorem nisi, consequat non elementum id, tempus nec enim. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Proin non lectus justo. Praesent tempor condimentum vestibulum. Mauris sed nunc leo. Curabitur nec sapien sed sem consequat egestas non vitae risus. Ut mauris nisl, facilisis sit amet congue sit amet, ullamcorper id nisi. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.

Pane 3

Pellentesque sit amet risus sit amet turpis mollis posuere sed non velit. Maecenas fermentum diam et nunc laoreet pellentesque. Etiam cursus lorem eu turpis interdum varius. Praesent laoreet, nisl ut vulputate gravida, ante dui hendrerit dolor, nec suscipit mauris lacus quis dui. Duis consequat lacinia neque, quis pharetra felis posuere sed. Nam ultrices tellus non sem faucibus vel mollis dolor ornare. Pellentesque sit amet risus justo. Nam faucibus nisl vel enim viverra consequat non commodo augue. Maecenas cursus elementum porttitor. Donec ac suscipit neque. Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Comments are closed. Please use Support forum for questions.