Default Canvas Slider not showing the contents of the second and third slide.

3 replies · opened Aug 2, 2016

PpbondreAug 2, 2016

Here is the section code I have in my page. I started of with the demo-app-landing.html The second slide shows up as just dark background. What am I doing wrong?

<section id="slider" class="slider-parallax swiper_wrapper full-screen clearfix">
<div class="swiper-container swiper-parent">
<div class="swiper-wrapper">

                &lt;div class="swiper-slide" style="background: url('demos/app-landing/images/hero/hero2.png') center center no-repeat; background-size: cover;"&gt;
                    &lt;div 
                         style="background: url('demos/app-landing/images/hero/hero2.png') center center no-repeat; background-size: cover;"&gt;
                        &lt;div class="vertical-middle" style="z-index: 2;"&gt;
                            &lt;div class="container dark clearfix"&gt;
                                &lt;div class="row clearfix"&gt;
                                    &lt;div class="col-md-6 col-sm-8"&gt;
                                        &lt;div class="emphasis-title"&gt;
                                            &lt;h1&gt; Identification Simplified.&lt;/h1&gt;
                                            &lt;h4&gt; A complete end-to-end managed identification platform.&lt;/h4&gt;
                                        &lt;/div&gt;
                                        &lt;a href="#" data-scrollto="#section-pricing" data-easing="easeInOutExpo" 
                                           data-speed="1250" data-offset="160" 
                                           class="button button-large button-white button-light capitalize" style="border-radius: 23px;"&gt;Try it Free
                                        &lt;a href="https://www.youtube.com/watch?v=GN_sytf667g" 
                                           class="hero-action-link" data-lightbox="iframe"&gt;&lt;i class="icon-play-sign"&gt;&lt;/i&gt; Watch the Video
                                    &lt;/div&gt;
                                &lt;/div&gt;
                            &lt;/div&gt;
                        &lt;/div&gt;
                        &lt;div class="video-wrap" style="position: absolute; height: 100%; z-index: 1;"&gt;
                            &lt;div class="video-overlay" style="background: rgba(0,0,0,0.2);"&gt;&lt;/div&gt;
                        &lt;/div&gt;
                    &lt;/div&gt;
               
                &lt;/div&gt;

               
                &lt;div class="swiper-slide" style="background: url('demos/app-landing/images/hero/hero2.png') center center no-repeat; background-size: cover;"&gt;
                    &lt;div 
                         style="background: url('demos/app-landing/images/hero/hero2.png') center center no-repeat; background-size: cover;"&gt;
                        &lt;div class="vertical-middle" style="z-index: 2;"&gt;
                            &lt;div class="container dark clearfix"&gt;
                                &lt;div class="row clearfix"&gt;
                                    &lt;div class="col-md-6 col-sm-8"&gt;
                                        &lt;div class="emphasis-title"&gt;
                                            &lt;h1&gt; Be your own password.&lt;/h1&gt;
                                            &lt;h4&gt; A complete end-to-end managed identification platform.&lt;/h4&gt;
                                        &lt;/div&gt;
                                        &lt;a href="#" data-scrollto="#section-pricing" data-easing="easeInOutExpo" 
                                           data-speed="1250" data-offset="160" 
                                           class="button button-large button-white button-light capitalize" style="border-radius: 23px;"&gt;Try it Free
                                        &lt;a href="https://www.youtube.com/watch?v=GN_sytf667g" 
                                           class="hero-action-link" data-lightbox="iframe"&gt;&lt;i class="icon-play-sign"&gt;&lt;/i&gt; Watch the Video
                                    &lt;/div&gt;
                                &lt;/div&gt;
                            &lt;/div&gt;
                        &lt;/div&gt;
                        &lt;div class="video-wrap" style="position: absolute; height: 100%; z-index: 1;"&gt;
                            &lt;div class="video-overlay" style="background: rgba(0,0,0,0.2);"&gt;&lt;/div&gt;
                        &lt;/div&gt;
                    &lt;/div&gt;
               
                &lt;/div&gt;

               
                &lt;div class="swiper-slide"&gt;
                    &lt;iframe width="560" height="315" src="http://www.youtube.com/embed/SZEflIVnhH8" frameborder="0" allowfullscreen&gt;&lt;/iframe&gt;
                &lt;/div&gt;
                
            &lt;/div&gt;
            &lt;div id="slider-arrow-left"&gt;&lt;i class="icon-angle-left"&gt;&lt;/i&gt;&lt;/div&gt;
				&lt;div id="slider-arrow-right"&gt;&lt;i class="icon-angle-right"&gt;&lt;/i&gt;&lt;/div&gt;
				&lt;div id="slide-number"&gt;&lt;div id="slide-number-current"&gt;&lt;/div&gt;&lt;span&gt;/&lt;/span&gt;&lt;div id="slide-number-total"&gt;&lt;/div&gt;&lt;/div&gt;

       &lt;/div&gt;
    &lt;/section&gt;
PpbondreAug 2, 2016

Attached is the screenshot of the second slide

PpbondreAug 5, 2016

Can someone help me with this issue?

SSemicolon WebSTAFFAug 8, 2016

Hello,

[sb_private_reply]We Really Apologize about the Delay in replying to your Support Query and Truly Truly appreciate your Patience with us![/sb_private_reply]

Can you please provide us with a Live URL so that we can check out the exact issue and provide you with a more accurate solution for this. Thanks for your Patience.

Meanwhile, do let us know if we can help you with anything else or if you find any further issues with Canvas.

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