Navigation
Archive / Background picture is off on mobile
This is archived content. Visit our new forum.

Tagged: 

  • Author
    Posts
  • January 27, 2017 at 1:22 am #1347372
    Dil
    Participant

    My parallax background images look great on desktop and such, but not on mobile, they are super zoomed in. Is it possible to set pictures for each section for mobile users only? Maybe I show a resized image or we just make them fixed properly via css and such…

    Thanks!

    January 27, 2017 at 1:22 am #1347373
    Dil
    Participant
    This reply has been marked as private.
    January 27, 2017 at 1:30 am #1347381
    Lely
    Moderator

    Hello Dil,

    We can use custom CSS. Unfortunately, I can’t see your site right now because of IP blocking issues. Please disable this at the moment so we can check what we can do.

    January 27, 2017 at 1:55 pm #1348148
    Dil
    Participant

    Sorry about that, it is my firewall. What country are you viewing from? If it is India, I’ve allowed access.

    January 28, 2017 at 12:08 am #1348608
    Friech
    Moderator

    Hi There,

    We are from different part of the world actually.

    Yes, we can apply a custom CSS to a background-image so it would fit on its container (section/row/column) on all times. But I doubt if the image would look acceptable. Please follow the posts below and understand how background-size works. And let us know how do you want to proceed.

    – https://community.theme.co/forums/topic/section-background-image-2/#post-691126

    – https://community.theme.co/forums/topic/background-image-on-phone/#post-780991

    Thanks.

    January 28, 2017 at 1:09 am #1348642
    Dil
    Participant

    Hi,

    I’d like to try this one, but how do i setup my photoshop to make it look good? what size dimentions do i use? and how do i find the page number and section id?

    January 28, 2017 at 6:22 am #1348775
    Christopher
    Moderator

    Hi there,

    Provided threads show you how background-image property woks and its limitation.
    For mobile, background image should be around 640 * 240 .
    Please check this link : http://stackoverflow.com/questions/17250944/background-image-size-for-mobile-devices

    To setup one page navigation, check this link : https://community.theme.co/kb/how-to-setup-one-page-navigation

    Hope it helps.

    January 29, 2017 at 10:58 pm #1350257
    Dil
    Participant

    Hi Chris, thanks for the firs tlink but, i was asking how i can find the page number and section id inorder for my css code to work…

    January 30, 2017 at 12:15 am #1350313
    Paul R
    Moderator

    Hi,

    To locate page id, kindly refer to the link below.

    https://community.theme.co/kb/how-to-locate-post-ids/

    Sections have ids that our automaticaaly generated by the theme.

    The first section will an id of x-section-1 and will increment depending how many section are in the page.

    x-section-1, x-section-2, x-section-3, x-section-4….

    But we always recommend to use unique ids to your sections to prevent conflicts.

    Hope that helps.

    January 30, 2017 at 8:30 pm #1351695
    Dil
    Participant
    This reply has been marked as private.
    January 31, 2017 at 2:33 am #1351934
    Christopher
    Moderator
    This reply has been marked as private.
    January 31, 2017 at 10:12 am #1352403
    Dil
    Participant

    Hi Chris,

    That did not work at all, in fact it broke what I had on inspect element responsive test. Could you try again?

    January 31, 2017 at 2:09 pm #1352703
    Jade
    Moderator

    Hi there,

    Would you mind providing your admin details so that we can check it on your current setup?

    Thank you.

    February 2, 2017 at 1:18 pm #1355574
    Dil
    Participant
    This reply has been marked as private.
    February 2, 2017 at 8:25 pm #1356130
    Rad
    Moderator

    Hi there,

    What do you mean it breaks what you had on inspect-element? Would you mind restoring it back? Or provide a screenshot of how it was setup before. I checked the discussion but I’m not sure the status or progress of the current issue.

    And please disable your Succuri first, I can’t access/check your site 🙂

    Thanks!

  • Author
    Posts
  • <script> jQuery(function($){ $("#no-reply-1347372 .bbp-template-notice, .bbp-no-topic .bbp-template-notice").removeClass('bbp-template-notice'); }); </script>