Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Text and Button overlay on 7.1 Slideshow/Carousel section


sarahcreates

Question

Hi all,

I have played around in 7.1 for a while now, and I've taken the step to build my first client site using it. Exciting!

I am using a Headline section with full width background image with overlaid text and button — standard out the box stuff. The client has requested that the background image becomes a slideshow so that there are 3 images it cycles between. Unfortunately it's not currently possible to add text and a button to the Image slideshow which would have been the easiest solution. I know that using Brine is an option but I don't want to step backwards to 7.0 at this stage. 

Would anyone happen to have code or could instruct me on how else I could go about this?

Screenshot attached is how the current Headline section looks. The site is jos-kitchen.co.uk but currently doesn't have any of this easily accessible as it's in holding page state.

Thanks in advance,

Sarah

Screenshot 2020-01-14 at 09.14.30.png

Link to post
  • Answers 1
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

Popular Posts

Just an update to say I have managed this with the help of another Circle member. Solution so far: I inserted a new section below the slideshow section and inputted my title and button into th

Posted Images

1 answer to this question

Recommended Posts

  • 0

Just an update to say I have managed this with the help of another Circle member.

Solution so far:

I inserted a new section below the slideshow section and inputted my title and button into that section.

I then used:

#block-ID for title, #block-id for button
{z-index:99; position:relative; top:-400px;}

Then I had a row of buttons in another section below the previous header image that I needed to move up into the now empty section space.

#block-id for button, #block-id for button, #block-id for button {z-index:99; position:relative; top:-90px;}

The only downside is that the new section which have the z-index applied has to maintain a specific height, and not be display:none which is restrictive. It does mean that my pinky button section is now much deeper than I had wanted it to be. If anyone knows how to reduce it and still maintain the above, I'd appreciate it!

Thanks
Sarah

Screenshot 2020-01-14 at 14.14.18.png

Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...