Tagged: ,

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • November 24, 2013 at 11:08 pm #192638
    JPOsteen

    I’m loving the Enfold theme and all of the possibilities. I can’t wait to experiment and see what I can come up with.

    I have a couple of questions:
    1. How do I get the color section background images to appear as static images on mobile device like the Enfold One Page Portfolio Demo?
    2. How can I change the color of the slide-out menu icon in the mobile layout?

    Thanks in advance!

    November 25, 2013 at 5:10 pm #192991
    Yigit

    Hi JPOsteen!

    1) Can you post the link to your website?
    2) Please add following code to Quick CSS in Enfold theme options under Styling tab and adjust as desired

    #advanced_menu_toggle { color: red; }

    Regards,
    Yigit

    November 27, 2013 at 6:07 am #193707
    JPOsteen
    This reply has been marked as private.
    November 28, 2013 at 6:26 pm #194453
    Yigit

    Hey!

    Please add following code to Quick CSS as well

    #advanced_menu_toggle { color: white; }
@media only screen and (max-width: 989px) { #top .av_slideshow_full .avia-slideshow-arrows a { display: none; }}

    You are going to need to hire a freelance developer to modify slider buttons as you have showed in your example

    Cheers!
    Yigit

    December 2, 2013 at 5:25 pm #195351
    JPOsteen

    Ok, thanks! But back to my first question. I would like for the color section background images to adjust to fit on mobile devices. When I choose “Stretch to fit” in the Background Repeat option it looks great on a mobile, but it makes the image larger than I want for a desktop. How can I make all of the background images “stretch to fit” on mobile devices, but not on desktops?

    December 2, 2013 at 5:33 pm #195355
    JPOsteen
    This reply has been marked as private.
    December 3, 2013 at 2:16 pm #195764
    Yigit

    Hi!

    Please try adding following code to Quick CSS as well

    @media only screen and (max-width: 767px) {  .avia-full-stretch, .avia-section {
-webkit-background-size: cover!important;
-moz-background-size: cover!important;
-o-background-size: cover!important;
background-size: cover!important;
}}

    You can upload your image on Gravatar using the same e-mail address you used to sign up here

    Cheers!
    Yigit

    January 25, 2014 at 11:55 pm #214913
    lathomas42

    Yigit – I wish I could say that the above code works but it only produces a color bg on an iOS device rather than stretching the image to fit.

    January 26, 2014 at 12:19 am #214918
    lathomas42

    So this is the code that allows the image to be stretched.

    if($repeat == 'stretch')
			         {
			             $background .= "background-repeat: no-repeat; ";
			             $class .= " avia-full-stretch";
			         }
			         else
			         {
			             $background .= "background-repeat: {$repeat}; ";
			         }

    If there was a way to have that code be applied on a mobile device, I believe that would solve a lot of problems. Is there anyway to have this only applied to devices with screen size < 768

  • Author
    Posts
Viewing 9 posts - 1 through 9 (of 9 total)
  • The topic ‘Color section and slide out menu on mobile device…’ is closed to new replies.