Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • April 26, 2016 at 2:00 pm #622125
    MattDalli

    Hi guys,

    I want to create something similar to this https://dl.dropboxusercontent.com/u/182922063/SliderforSOM.PNG if possible. The ‘frame’ of where the curve is should be static and the image and text should be dynamic (i.e. can be changed after a certain time or on user click).

    I’ve looked at the LayerSlider WP but I didn’t see that this is possible. Is there something that I’m missing? Or is there particular steps/code to add?

    Thanks as always!

    Matt

    April 28, 2016 at 1:44 pm #623701
    Andy

    Hey Matthew!

    I think you could achieve something like this with LayerSlider. Just use different layers, one with the picture and on with the graphic (curve) and one for text.

    Regards,
    Andy

    April 29, 2016 at 10:15 am #624196
    MattDalli

    Hey Andy,

    Thanks for getting in touch! I’ll give it a try…I didn’t notice that it’s like using Photoshop/Illustrator. Will get back to you once I test :)

    Regards,
    Matthew

    April 29, 2016 at 11:12 am #624245
    Vinay

    Hi!

    As i understand you like to make the red frame static and move the images behind them correct? As Andy suggested you could use layer slider to achieve this or as an alternate solution you can make the frame images and add it to a color section background and add custom css class to it with negative margin and higher z-index to overlap the layers.

    Please feel free to respond to this ticket if you have any more questions for us.

    Cheers!
    Vinay

    April 29, 2016 at 11:22 am #624256
    MattDalli

    Hi Vinnie,

    Thanks a lot for getting back to me. I’m managing great with Layer Slider as I’m achievening what I need slowly slowly. My only issue is that it seems to cut the photos on the right hand side as you can see here: http://newsite.specialolympicsmalta.org/

    Any ideas to why is this please? I put the short code of the slider in a text block.

    April 29, 2016 at 12:53 pm #624344
    Vinay

    Hi!

    You are welcome! The image is not big enough please use a large image for the frame to fill full screen. or as an alternate solution make the images slide using a slider and create a color section with the frame as a background image and overlap it with negative margins.

    Cheers!
    Vinay

    April 29, 2016 at 1:35 pm #624390
    MattDalli

    Hi Vinnie,

    Thanks for getting back to me. I’m doing the image up to 1920 pixels in width and it’s still not coming to the full width. Unfortunately, I’m not understanding exactly what you’re explaining regarding the slider and negative margins.

    I’ve setup a temp account for you, if you could nudge this in the right direction, I’d appreciate.

    Thanks,

    Matt

    April 29, 2016 at 2:34 pm #624500
    Vinay

    Hi!

    We are working on your ticket please wait while we update the results here soon.

    Regards,
    Vinay

    April 29, 2016 at 2:48 pm #624514
    MattDalli

    Thanks Vinnie!

    April 29, 2016 at 5:17 pm #624665
    Vinay

    Hey!

    Please check the link in private and the setup of the slider options. We have added a simple span tag with a css class “slider-frame” which is then made to look like a frame using custom css and custom class “full-width” to the slider.

    
.slider-frame {
width: 100vw;
min-height: 600px;
display: inline-block!important;  
position:absolute;
left:0;
bottom:0;
transform:translate(-50px, 20px);
 background:url(https://i0.wp.com/newsite.specialolympicsmalta.org/wp-content/uploads/2016/04/SOM-Curve-Slider-01.png);
  background-size:cover;
  background-position:center center;
}
.full-width .container{
    min-width: 100vw !important;
}

    Regards,
    Vinay

    April 29, 2016 at 6:11 pm #624674
    MattDalli

    Hi Vinnie,

    Thanks a lot for your help, it seems to be working great! Maybe a dumb question but do I have to add the CSS that you wrote and if so where please? I’m assuming that you already did this since it’s working correct? If so, can you kindly indicate where it is located?

    Thanks a bunch for your help!

    • This reply was modified 7 years, 11 months ago by MattDalli.
    April 29, 2016 at 9:25 pm #624783
    Basilis

    Hi,

    Those CSS are been added at the Custom CSS section, on the dashboard admin.
    They are working now, cause Vin already added them.
    You can keep them as a backup and add them some other time if you want to.

    Let us know if you have any other question, would love to assist you further

    Best regards,
    Basilis

    May 3, 2016 at 11:43 am #626347
    MattDalli

    Thank you very much Basilis for getting back to me.

    Appreciate everyone’s help in this, it’s working just as I wanted to :)

    Regards,
    Matt

    May 3, 2016 at 7:23 pm #626706
    Vinay

    Hey!

    Glad we could help! we really appreciate it if you rate our theme on themeforest :)

    Thank you for using Enfold!

    Best regards,
    Vinay

  • Author
    Posts
Viewing 14 posts - 1 through 14 (of 14 total)
  • The topic ‘Slider with Foreground Slider’ is closed to new replies.