Vasterad

Vasterad supports this item

Supported

This author's response time can be up to 1 business day.

642 comments found.

user246

user246 Purchased

hi,

i have a question regarding this layout https://themeforest.net/item/nevia-responsive-html5-template/3708895

my purchase code is:- 1741bff4-09dc-40f1-9b71-352ca146d475

i made www.cptauh.ae out of your layout

my problem is with layerslider. this is an example of the captions that i am using:-

Cyber Security is what we do.

it works perfectly on laptop view, but the problem is there are no captions for mobile screen view and the captions are going away

i need captions to show under the slider in mobile screen view and those captions are hidden in laptop view

please see www.esolutions-dm.ae and look at the slider on the home page. next go to code inspector and switch to mobile screen view and you will see extra captions under the slider. i need the same thing in the slider of www.cptauh.ae

how do i do that?

thanks

user246

user246 Purchased

thanks. i will try your code later

in https://pasteboard.co/GKVkF4V.png you will see that the image in the slider is shown in full and it is the same as the image when in laptop view, but the image size is smaller. this is what i saw when i tried iphone 6 in resposive view in code inspector on my laptop

https://pasteboard.co/GKVldR6.png is what i saw on an actual iphone 6. look at the image in the slider. this is the first slide in the slider but it is not the same as when you see it on laptop view. on the actual iphone 6 it zoomed in to part of picture and the word cyber is shown in big. i dont want that to happen and i want the same thing to happen in https://pasteboard.co/GKVkF4V.png

compare the images that you see in slider on your laptop and on your mobile phone and u will see what i mean

Try this CSS:

    .ls-slide .ls-bg  {
        height: auto !important;
        margin-left: 0px !important;
        margin-top: 0px !important;
        object-fit: cover !important;
        width: 100% !important;
        top: 0 !important;
        left: 0 !important;
    }
You have to add ”.ls-bg” class for background image:
<img src="http://www.cptauh.ae/images/slide-01.jpg" class="ls-bg" alt="" />
user246

user246 Purchased

Thanks for your reply. I will let u know what happens

i tried your code. the code for picturer in slide worked, but the code for the caption didnt work

i want to do it like this and i have 2 captions:-
<!-- Slide 1 -->
<article class="ls-layer" style="slidedelay: 10000;">
   <img src="images/slide-01.jpg" class="ls-bg" alt="" />
   <h3 class="ls-s1 caption-transparent" style="top: 357px; left: 40px; width: 192px">Cyber Security is what we do.</h3>
   <div class="mobcap">
      <p>Cyber Security is what we do.</p>
   </div>
</article>

div class mobcap is for mobile captions, but the problem is div class mobcap is disappearing when i run the code and i cant find it in code inspector. it is showing when i say view page source

how do i stop it from disappearing? i want the line of text to come under the slider. later on i will add media query to make it show only in mobile view

It won’t work. You can’t move caption outside slider’s container.

ok. i have another idea. plz check www.cptauh.ae

i added:- <div style="text-align: center;">text goes here</div> i want the text in that div to change depending on which slide is showing. if the first slide is active then that div will know and the caption of first slide will show in the div. when the second slide shows the text will change and so on

is this possible?

In theory but it needs some coding and it won’t be perfect. I’m not able to do that. Maybe with FlexSlider it would be easier to achieve but I’m not sure. http://flexslider.woothemes.com/basic-slider-with-caption.html I’m afraid I can’t help.

by
by
by
by
by
by