close

YOOtoppanel

Publish any content here. It's suitable for self presentation, legal information or login module.
YOOtheme
YOOtoppanelModule Information
  • module position: "cpanel"
  • sliding height is configurable

Configuration
Use the template configuration to turned off the Top Panel. How does it look? Click here!


Top Panel
Sunday, 19 May 2024
YOOlightbox PDF Print E-mail
Test LightboxWe’ve integrated a visual clone of the popular Lightbox JS v2.0 called Slimbox. Slimbox is smaller, more efficient, more convenient and 100% compatible with the original Lightbox v2.

Lightbox allows you to show overlay popups of images on the page you are currently at instead of linking to a new window. It shows a small preloader animation before showing the full image.

You have 2 different ways to use Slimbox/Lightbox. For demonstrating the "YOOtheme" Method, just click image to the right.


1. "YOOtheme" Method

Add a class="lightbox" attribute to any image tag. Our script takes care of everything and will enable the lightbox behavior. It's a quick and simple way to add the lightbox effect to any image.
The related popup image filename must have the suffix _lightbox and must be in the same folder as the image.
For example:
<img class="lightbox" title="my caption" src="image.jpg" width="240" height="180" />
Optional: Use the title attribute if you want to show a caption.


2. "traditional" Method

Add a rel="lightbox" attribute to any link tag to activate the lightbox.

For example:
<a href="image.jpg" rel="lightbox" title="my caption">image #1</a>
Optional: Use the title attribute if you want to show a caption.

If you have a set of related images that you would like to group, follow step one but additionally include a group name between square brackets in the rel attribute.

For example:
<a href="image-1.jpg" rel="lightbox[a]">image #1</a>
<a href="image-2.jpg" rel="lightbox[a]">image #2</a>
Try out this feature by clicking on the following links: image #1 and showcase with two images
 
Powerd by YOOtheme
Sign up today!
XHTML Validation
CSS Validation
Powerd by YOOtheme