Can't I pop a box on the image slide?

2 replies·opened Feb 22, 2021

high8skyFeb 22, 2021

If you put a div on top of an image slide, it is hidden. How can I do this?

SemiColonWebSTAFFFeb 22, 2021

Hello,

Make sure that you are adding the DIV inside the .swiper-slide > .container DIV for the content to be visible correctly. Example:

<div class="swiper-slide dark">
	<div class="container">
		<div>Custom Content</div>
		<div class="slider-caption slider-caption-center">
			<h2 data-animate="fadeInUp">Welcome to Canvas</h2>
			<p class="d-none d-sm-block" data-animate="fadeInUp" data-delay="200">Create just what you need for your Perfect Website. Choose from a wide range of Elements & simply put them on our Canvas.</p>
		</div>
	</div>
	<div class="swiper-slide-bg" style="background-image: url('images/slider/swiper/1.jpg');"></div>
</div>

Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

high8skyFeb 23, 2021

You want to use a div floating on top of a Flex Slide slide.

<!-- Flex Slide
				============================================= -->
				<div class="fslider h-100 position-absolute dark" data-speed="1500" data-autoplay="true" data-pause="6000" data-animation="fade" data-arrows="false" data-pagi="false" data-hover="false" data-touch="false">
					<div class="flexslider">
						<div class="slider-wrap">
							<div class="slide" style="background: url('images/background/main_bg.jpg') center center; background-size: cover;">

Have the same question, or something new?

Sign in to the Canvas dashboard to reply or open your own topic. Canvas owners get direct help from the SemiColonWeb team.

Reply on the dashboard