[Resolved] Off canva background image not displayed with chromium based laptop browser

Home Forums Support [Resolved] Off canva background image not displayed with chromium based laptop browser

Home Forums Support Off canva background image not displayed with chromium based laptop browser

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #1095390
    cjenti

    Hi!
    strange situation… my off canva background image isn’t displayed with chromium based laptop browsers (chrome, opera, vivaldi…).
    It’s ok with all mozilla browers (laptop+mobile), ok with chromium based mobile browsers (chrome, opera) but not laptop ones. What have I missed? 😉
    As I go, I don’t really know why but I didn’t even check with edge or other IE…

    second question: how can I move shopping-bag icon (woo com) on the left of the menu icon?
    last question: need to make menu icon bigger (but not other icons on primary menu)

    By the way: gp is perfect!

    thanks

    here’s off canva added css:

    .offside–left.is-open, .offside-js–is-left .offside-sliding-element {
    -webkit-transform: translate3d(3500px,0,0);
    -moz-transform: translate3d(3500px,0,0);
    -ms-transform: translate3d(350px,0,0);
    -o-transform: translate3d(350px,0,0);
    transform: translate3d(3500px,0,0);
    }
    .offside–right.is-open, .offside-js–is-right .offside-sliding-element {
    -webkit-transform: translate3d(-350px,0,0);
    -moz-transform: translate3d(-350px,0,0);
    -ms-transform: translate3d(-350px,0,0);
    -o-transform: translate3d(-350px,0,0);
    transform: translate3d(-350px,0,0);
    }

    .main-navigation.offside {
    width: 350px;
    }
    .offside–left {
    left: -350px;
    }
    .offside–right {
    right: -350px;
    }
    .offside-js–is-left.slide-opened .slideout-overlay button.slideout-exit {
    left: 345px;
    }

    .main-navigation.slideout-navigation {
    background-color: #8D888C;
    background-image:
    url(“https://rdp.uyoop.com/wp-content/uploads/RdP-menu.jpg”);
    background-attachment: fixed;
    background-position: center;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-repeat: no-repeat;
    width: 350px;
    }

    #1095664
    David
    Staff
    Customer Support

    Hi there,

    lets see if we can fix the Off Canvas issue first.
    Check your properties in the first CSS rule – a few of them have 3500px instead of 350px.
    eg. transform: translate3d(3500px,0,0);

    #1096591
    cjenti

    woops… Thanks for that point, it’s better like this, but the background picture still doesn’t show up with chromium based browsers… while it’s displayed on mozilla browsers and edge also (i’ve check it). LScache is deactivated. Cache and optimisation are off (minify, defer, inline…). It can’t the problem.

    #1096815
    David
    Staff
    Customer Support

    That is odd – what happens if you remove the background-attachment: fixed; property?

    #1096836
    cjenti

    That’s it! OK without [background-attachment: fixed; property]! Thanks for this.
    When you’ll have a moment, can you tell me how to move the shopping cart icon on the left of the menu icon, and then, how to make menu icon bigger please?
    Thanks again. Great reactivity and support!

    #1096846
    David
    Staff
    Customer Support

    Glad to be of help.
    Would you mind raising a new topic – its easier for us to track and for you and others to find related topics.

Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.