• Skip to main content
  • Skip to forum navigation

StudioPress

  • Shop for Themes
  • My StudioPress

Forum navigation

  • Home
  • General Genesis Discussions
  • StudioPress Themes
  • Genesis Blocks
    • Genesis Blocks
    • Genesis Custom Blocks
  • Retired Themes
  • FAQs
  • Forum Rules
  • Internationalization and Translations
  • Forum Bugs and Suggestions
  • Forum Log In

Are You Using The WordPress Block Editor?

Genesis now offers plugins that help you build better sites faster with the WordPress block editor (Gutenberg). Try the feature-rich free versions of each plugin for yourself!

Genesis Blocks Genesis Custom Blocks

Parallax Pro browser issue with images

Welcome!

These forums are for general discussion on WordPress and Genesis. Official support for StudioPress themes is offered exclusively at My StudioPress. Responses in this forum are not guaranteed. Please note that this forum will require a new username, separate from the one used for My.StudioPress.

Log In
Register Lost Password

Community Forums › Forums › Archived Forums › Design Tips and Tricks › Parallax Pro browser issue with images

This topic is: not resolved

Tagged: browser, cut off images, image fit in window, image visibility

  • This topic has 11 replies, 6 voices, and was last updated 7 years, 6 months ago by apple_jax.
Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • April 3, 2017 at 9:27 am #204223
    designerwriter
    Member

    The homepage images are only partially showing up in the mobile version on an android phone. I was told it was a browser issue. Is there a code that I can set in CSS that makes the browser reveal the full images on the home page in the mobile version? Thanks in advance!

    http://i-5cannabisholdingsltd.com/
    April 5, 2017 at 3:44 pm #204352
    designerwriter
    Member

    Is anyone out there who can answer my question?

    June 29, 2017 at 7:07 am #208448
    bwhatley87
    Member

    I have this same question.

    June 29, 2017 at 8:24 pm #208499
    ᴅᴀᴠɪᴅ
    Member

    Which part of the image isn't showing? If you mean the sides, then this is neccessary otherwise the image would need to be stretched in order to fit.

    If you're talking about seeing the end of the image when you scroll, this is due to the parallax effect, so in this case you'd need to upload an image with a larger height.


    I love helping creative entrepreneurs build epic things with WP & Genesis.

    Follow on Twitter

    September 7, 2017 at 6:31 pm #211206
    Rama.myVA
    Member

    I'm having this same problem with parallax.
    site is https://ramakalia.com/

    on desktop browser, looks great.

    on mobile it shows only a blurry abstract of left side of images.
    Is it possible to have the images resize more appropriately? Responsively?
    Otherwise this is not really a fully responsive theme?

    I wanted to add text to my home page background image, but without knowing if it will resize, at this point there is no point?

    I have checked site on both iphone and ipad - both vague, blurriness as background.
    On the demo site - images anyway - looks like the guitar image adjusts on the mobile?

    Any insight? Solutions? Many people must have come across this? Parallax has been around a while. Appreciate your help.

    Thanks,
    Rama

    September 7, 2017 at 6:42 pm #211207
    Rama.myVA
    Member

    on a phone at least your images still look sharp/clear/detailed.
    What size images are you using? Do you know the resolution?

    My photos are just a blurry abstract. Not sure what to try.
    Hope someone has some insight for us.

    Thanks.
    R

    October 4, 2017 at 7:39 am #212166
    apple_jax
    Member

    Hey There,

    I got somewhat of an answer from studiopress:

    The default in parallax is to not reduce the original size of the images, so there is plenty of image to fill the screen. In the past, I have used images with items on a smaller scale, and that worked better for mobile not looking so terrible.

    If you want your images to reduce, you can replace following code block at line# 1836, in your child theme's "style.css" file.

    However, the line that says: "background-size: contain" will ensure that your images are 100% in screen, and might create issues with your home page text/layout.

    If anyone has a better solution to this, or knows other options for the background size issue, I would love to know it!

    CSS HERE:

    Change From:

    .home-section-1, .home-section-3, .home-section-5 {
    background-attachment: scroll;
    background-position: top;
    -webkit-background-size: 100%;
    -moz-background-size: 100%;
    background-size: 100%;
    }

    To:

    .home-section-1, .home-section-3, .home-section-5 {
    background-attachment: scroll;
    background-position: top;
    -webkit-background-size: 100%;
    -moz-background-size: 100%;
    background-size: contain;
    }

    October 4, 2017 at 7:46 am #212167
    apple_jax
    Member

    Scratch that. I changed 'contain' to 'cover' and that seems to work the best.

    December 16, 2017 at 11:27 am #214605
    Rainbowsplash
    Member

    I'm ready to dive in and get Parallax Pro for a band site, but the demo doesn't even show on iphone properly. Have you been able to get this working properly? Here's the live demo link, which only shows a small portion of the home page image: https://my.studiopress.com/themes/parallax/#demo-full

    December 16, 2017 at 12:46 pm #214606
    apple_jax
    Member

    Yes. Mine is working fabulously: http://flourishboston.com/

    December 16, 2017 at 1:34 pm #214607
    Rainbowsplash
    Member

    Yes, I checked on my iphone and your site looks great. It seems like the best images will be where the sides aren't so important. 🙂 Thanks for letting me know.

    December 16, 2017 at 8:21 pm #214619
    apple_jax
    Member

    Yes. The thing to remember is that mobile & desktop images are different proportions.

    Choose photos that have objects near the center and give your edges some space for adjusting to screen size

  • Author
    Posts
Viewing 12 posts - 1 through 12 (of 12 total)
  • The forum ‘Design Tips and Tricks’ is closed to new topics and replies.

CTA

Ready to get started? Create a site or shop for themes.

Create a site with WP EngineShop for Themes

Footer

StudioPress

© 2025 WPEngine, Inc.

Products
  • Create a Site with WP Engine
  • Shop for Themes
  • Theme Features
  • Get Started
  • Showcase
Company
  • Brand Assets
  • Terms of Service
  • Accptable Usse Policy
  • Privacy Policy
  • Refund Policy
  • Contact Us
Community
  • Find Developers
  • Forums
  • Facebook Group
  • #GenesisWP
  • Showcase
Resources
  • StudioPress Blog
  • Help & Documentation
  • FAQs
  • Code Snippets
  • Affiliates
Connect
  • StudioPress Live
  • StudioPress FM
  • Facebook
  • Twitter
  • Dribbble