Popup Links
Use the popup plugin in your content to include links that open in popup windows.
X3 uses the popup internally for galleries, but it is made available for you to use in your page content also. The X3 popup is perfect for image links, but cant also be used for custom links- and content.
Usage
To use the popup with your links, simply add the data-popup
attribute to your link.
Click Me
Popup links use the zoom-in cursor on mouse-hover to emphasize that the link opens a popup.
Click Me
Titles
To add a title for the image, just use data-popup-title="title"
. When using this attribute, you don't need to set the data-popup attribute, because it is implicit.
Click Me
Links
The popup link feature is practical for loading embeddable content, like Youtube Videos.
Youtube Video
Custom Content
You can use the popup to display inline content with the data-popup-content
tag.
Click Me
Image Links
Nothing wrong with using images inside your links ...
Link Groups
You can also group links so that you can navigate between them in the same popup.
... Optionally, if you can't or don't want to add all grouped links in the same container, use the rel
attribute to assign a group name.
Macbook
iPhone
iPad
Advanced
A few more attributes for the ambitious.
Macbook
www.photo.gallery
Custom
Force popup image-type
Macbook.jpg or open www.photo.gallery in new window
www.photo.gallery opens in new window on mobile devices.
Custom CSS Class
Force popup image-type
Browser Popup Window
You can also set links to open in native brower popup windows. Although not as elegant as the X3 popup, this feature can be useful when loading html pages and/or when scrollbar is required. The native browser popup method is basically a new browser window, limited only by size and controls.
Flamepix.com in Popup
By default, the popup window is set to open at dimensions 600 x 400 px, but you can set your own size:
1100 x 800
1100 x 800
Popup windows will always be centered, and will never open larger than the visitors screen. Furthermore, "popup" windows are not supported on most mobile/touch devices, and will instead open in a "new tab".
Native X3 Gallery
Below, you can see the native X3 gallery displaying images from within this folder. The X3 gallery also uses a the popup feature, but with a slightly more advanced integration.