Popup Links

Image
Simply add the data-popup attribute in your link.

image

image

Title
Include the data-popup-title attribute in your link.

title

title

Groups
Group your links into a single popup by adding them inside a data-popup-container.

ocean 1
ocean 2
ocean 3

Or use the "rel" attribute to group items.

ocean 1
ocean 2
ocean 3

ocean 1 ocean 2 ocean 3

Image Links
You can use images in your links, which provides a nice zoom effect.

You can also group your image links.

Youtube
The popup is useful for displaying videos from Youtube or Vimeo.

Youtube

Youtube

Video mp4
You can also display local-hosted mp4 video files.

video

video

Html content
You can also use the popup to display basic html content.

html

html

Website
You can also open external websites in the popup, if allowed to load inside an iframe.

bbc.com

website

Advanced options
The content popup comes with plenty advanced options.

html content in popup
force image type
disable url#hash history
assign custom url#hash id
assign custom popup CSS class
assign custom CSS class for html
enable download button
disable fullscreen button
disable slideshow play button
disable zoom button
disable arrow control buttons
assign option source for zoom
disable popup loop
assign popup transition
assign slideshow transition
disable caption autohide
assign custom background color
custom background for specific image
assign background color from images
assign caption style
assign caption position
disable caption
inform source img width for zoom effect
inform source img height for zoom effect

Browser Popup Window

You can also open links in brower popup windows. Although not as elegant as the X3 popup, it is more functional and has no restrictions when opening external websites.

Flamepix.com

Flamepix.com

You can also change the popup window size (does not work on mobile):

Flamepix.com

Flamepix.com large popup

X3 gallery popups

The X3 gallery uses a slightly more advanced version of the popup.