Welcome to TalkGraphics.com
Results 1 to 8 of 8
  1. #1

    Default Responsive site not working correctly in Chrome

    Hello all
    Originally my website worked fine in all the browsers but has suddenly started to play up in Chrome.
    As you scroll down the page there are 2 background images that display behind white space consecutively, but in Chrome the first image disappears just leaving white space where the second image is supposed to be.
    Difficult to understand, but if you view the site in Edge and then Chrome you will get the idea.

    The site is www.actionitcs.com

    Thanks in advance for any input

  2. #2
    Join Date
    Apr 2015
    Location
    Germany
    Posts
    927

    Default Re: Responsive site not working correctly in Chrome

    See the problem and it might be a chrome bug.
    You could try if adding the following to the page head code fixes it:
    Code:
    <script>$(function(){setTimeout(function(){if(xr_chrome)$(".parallax,.parallax2").css("will-change","transform");},1000);});</script>
    Found a hint for that at stackoverflow but didn't fully test it. Just tried if directly adding the css in the developer console in chrome helped, and it did. But adding the same to firefox caused another problem, so adding some code seems the quickest solution.

  3. #3

    Default Re: Responsive site not working correctly in Chrome

    Thanks Siran
    Will give that a try

  4. #4
    Join Date
    Jun 2012
    Location
    CZECH
    Posts
    147

    Default Re: Responsive site not working correctly in Chrome

    Thanks Siran

  5. #5

    Default Re: Responsive site not working correctly in Chrome

    No luck mate
    Appreciate the effort though

  6. #6
    Join Date
    Apr 2015
    Location
    Germany
    Posts
    927

    Default Re: Responsive site not working correctly in Chrome

    Not sure why it didn't work, but this should. You need to place it at the page body instead of the head.
    Code:
    <script>
    if(navigator.userAgent.indexOf('Chrome')>=0){
     document.getElementsByClassName("parallax")[0].style.willChange="transform";
     document.getElementsByClassName("parallax2")[0].style.willChange="transform";
    }
    </script>
    If you consider to use it I recommend you try it on older versions of Chrome too before uploading to your site.

  7. #7
    Join Date
    Jun 2012
    Location
    CZECH
    Posts
    147

    Default Re: Responsive site not working correctly in Chrome

    This is a fully functional variant with multiple parallaxes:

    <script>$(function(){setTimeout(function(){if(xr_c hrome)$(".parallax,.parallax2,.parallax1,.parallax 3").css("will-change","transform");},1000);});</script>

  8. #8

    Default Re: Responsive site not working correctly in Chrome

    Thanks Siran
    That did work.

    Spamiky thanks for the input.

 

 

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •