Swiper

The content from the swipers below comes from the module photo album and is called via function swiper(album ID, img size, show first).

The only additional requirement is that the div class"aspect-radio-box" is set in the page where that function is called. That is the only variable that is going to change, depending on content of the application where it is going to be used.

<style type="text/css">
.aspect-ratio-box {
height: 0;
padding-top: 76%;
position: relative;
margin-bottom: 30px;
}
</style">

If you are going to put this CSS in the main.css page of the project, be careful if you use the generic selector:

  • .aspect-radio-box

affecting the entire website

Think about alternatives:

  • article .aspect-radio-box
  • .my_class .aspect-radio-box
  • #my_id .aspect-radio-box