Skip to content
  • Recent
  • Tags
  • Popular
  • Users
  • Search
Skins
  • Light
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dark
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • Default (No Skin)
  • No Skin
Collapse

Lay Theme Forum

  1. Home
  2. Addons
  3. centred Carousel fixed width and proportions

centred Carousel fixed width and proportions

Scheduled Pinned Locked Moved Addons
5 Posts 2 Posters 147 Views
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • C Offline
    C Offline
    cschm.tz
    wrote on last edited by
    #1

    Good afternoon, hope you are very well!

    I am trying to have a centred Carousel (currently at a fixed height of 80vh) which mantains its proportions until a specific breakingpoint and then shrinks to the centre, like this example https://vrints-kolsteren.com/

    I have had a long look at other discussions but don't seem to find a solution for this, but I am sure it should be doable would you be able to point me in the right direction at all?

    Also in the custom placement of the carousel captions, they seem to appear duplicate when shrinking the browser, do you know why this could be? Screen shots attached.

    This is the link to my current test page
    http://s955093523.mialojamiento.es/homepage-copy-copy/?preview=true

    Thanks so much for your time in advance.
    All the best,

    Christian

    Captura-de-pantalla-2023-03-21-a-las-20.23.08.jpg

    Captura-de-pantalla-2023-03-21-a-las-20.22.47.jpg

    C 1 Reply Last reply
    0
    • C cschm.tz

      Good afternoon, hope you are very well!

      I am trying to have a centred Carousel (currently at a fixed height of 80vh) which mantains its proportions until a specific breakingpoint and then shrinks to the centre, like this example https://vrints-kolsteren.com/

      I have had a long look at other discussions but don't seem to find a solution for this, but I am sure it should be doable would you be able to point me in the right direction at all?

      Also in the custom placement of the carousel captions, they seem to appear duplicate when shrinking the browser, do you know why this could be? Screen shots attached.

      This is the link to my current test page
      http://s955093523.mialojamiento.es/homepage-copy-copy/?preview=true

      Thanks so much for your time in advance.
      All the best,

      Christian

      Captura-de-pantalla-2023-03-21-a-las-20.23.08.jpg

      Captura-de-pantalla-2023-03-21-a-las-20.22.47.jpg

      C Offline
      C Offline
      cschm.tz
      wrote on last edited by
      #2

      @cschm-tz

      Hey hope you are both very well @Richard @arminunruh !

      Just wanted to know if you had received this at all and if you could kindly any tips/shed some light? Apologies if you have, I know you are busy people.

      All the best and thank you,
      Christian

      1 Reply Last reply
      0
      • arminunruhA Offline
        arminunruhA Offline
        arminunruh
        Global Moderator
        wrote on last edited by
        #3

        sorry for the late response!

        so i created a carousel, center aligned it.
        these are the settings:
        Screenshot 2023-03-30 at 19.07.05.png

        then in lay options -> carousel addon

        i set "Vertical Alignment of Slides" to "middle"

        and it works like on your example website

        I think you probably checked "fill slides" and thats why it cuts off the image when your browser becomes smaller

        C 1 Reply Last reply
        0
        • arminunruhA arminunruh

          sorry for the late response!

          so i created a carousel, center aligned it.
          these are the settings:
          Screenshot 2023-03-30 at 19.07.05.png

          then in lay options -> carousel addon

          i set "Vertical Alignment of Slides" to "middle"

          and it works like on your example website

          I think you probably checked "fill slides" and thats why it cuts off the image when your browser becomes smaller

          C Offline
          C Offline
          cschm.tz
          wrote on last edited by
          #4

          Thanks so much for your guidance @arminunruh i think this may work!!

          Do you know what is causing the duplicated captions I mentioned? This happens when manipulating the width/size of the browser, I have reattached a screenshot just in case and the link to the site is this one.
          http://s955093523.mialojamiento.es/homepage-copy/?preview=true

          Thanks very much and all the best
          Christian

          Captura de pantalla 2023-04-03 a las 15.55.35.jpg

          1 Reply Last reply
          0
          • arminunruhA Offline
            arminunruhA Offline
            arminunruh
            Global Moderator
            wrote on last edited by
            #5

            oh yea
            its because the browser cant resize everything fast enough causing the next caption to show up

            update the carousel addon now

            then use this css:

            .single-caption{
            opacity: 0;
            }
            .single-caption.caption-active{
            opacity: 1;
            }
            
            1 Reply Last reply
            0
            Reply
            • Reply as topic
            Log in to reply
            • Oldest to Newest
            • Newest to Oldest
            • Most Votes


            I also code custom websites or custom Lay features.
            šŸ’æ Email me here: šŸ’æ
            info@laytheme.com

            Before you post:
            1. When using a WordPress Cache plugin, disable it or clear your cache.
            2. Update Lay Theme and all Lay Theme Addons
            3. Disable all Plugins
            4. Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code", click "Save Changes"

            This often solves issues you might run into

            When you post:
            1. Post a link to where the problem is
            2. Does the problem happen on Chrome, Firefox, Safari or iPhone or Android?
            3. If the problem is difficult to explain, post screenshots / link to a video to explain it
            Online Users
            M
            MWPA
            Forgot your key, lost your files, need a previous Lay Theme or Addon version? Go to www.laykeymanager.com
            laytheme.com
            • Login

            • Don't have an account? Register

            • Login or register to search.
            • First post
              Last post
            0
            • Recent
            • Tags
            • Popular
            • Users
            • Search