{Theme} have two types of puzzle boxes
Puzzle box – type1
HTML markup
1 2 3 4 5 |
<div class="ct-puzzleBox" data-height="566"> <img src="../assets/images/demo-content/puzzleBox-1.jpg" alt="Image" class="ct-puzzleBox--image1 animated" data-fx="zoomIn" data-time="1000"/> <img src="../assets/images/demo-content/puzzleBox-2.jpg" alt="Image" class="ct-puzzleBox--image2 animated" data-fx="fadeInRight"/> <img src="../assets/images/demo-content/puzzleBox-3.jpg" alt="Image" class="ct-puzzleBox--image3 animated" data-fx="fadeInLeft"/> </div> |
Screenshot
Puzzle box – type2
HTML markup
1 2 3 4 5 6 |
<div class="ct-puzzleBox ct-puzzleBox--type2"> <img src="../assets/images/demo-content/image-4.jpg" alt="Image"/> <img src="../assets/images/demo-content/image-5.jpg" alt="Image"/> <img src="../assets/images/demo-content/image-6.jpg" alt="Image"/> <img src="../assets/images/demo-content/image-7.jpg" alt="Image"/> </div> |
Screenshot