Centred, with parts of the neighbours
Slick's centerMode with slidesToShow: 1.6. On a narrow window it shows one slide. With bodyClass: true the page knows the slide, and the line under the heading takes the colour of the photo.
Lightbox and zoom
A slider of links opens its photos in the lightbox, as the CORE gallery writes it. There, zoom by a click, the wheel or a pinch, pan by a drag or the keys, and use the thumbnails, the slideshow and full screen.
A gallery as the EchoEditor writes it
A video, a page and content of the page
As fancyBox's markup asks for them: A video file, a page in a frame, content of this page.
Content of this page
It is the element itself, so what you type stays when you move on, and it goes back into the page, hidden, when the lightbox closes.
The detail of a small image
The same photo twice. On the left, EchoZoom on the page itself: the image is the whole photo shown small, so it zooms up to its own size. On the right, a thumbnail that opens the photo in the lightbox, which zooms in the same way.
Video in a slider
What CORE writes for a video slide. The video plays only while its slide shows and the slider is in view, and the autoplay waits for its data-len. Photos fill the slide as the taller video does.
Reveal and counter
A paragraph with .reveal.from-left.
A paragraph with .reveal.from-right.
A paragraph with data-reveal, with a link that the keyboard must reach before it appears.
A row with data-reveal="row".
This heading has no class in the HTML
Neither has this paragraph. EchoReveal.bind adds them, as a rule on a page or a slide can.
A site in numbers
The block a site puts under its first photo, here for mountain guides. Each number counts up when it comes into view and ends on the text of the HTML, so without a script, or where nothing may move, it stands as written.
- In the mountains since
- 2006
- Trips led
- 3,480
- What guests give us
- 4.9 / 5
- A week with a guide, all included
- 18,900 Kč
Markup the EchoEditor builder writes
A data-slider with Slick's options, started by EchoSlider.bind(). Without a script it is a row that scrolls.