Viewing 30 posts - 1 through 30 (of 31 total)
1 2
  • Author
    Posts
  • April 7, 2017 at 11:59 am #773876
    Jürgen

    Hi,
    The problem was already discussed in another Treat. But I have not found a solution.
    I want to make a parallax fixed background image on smartphones and tablets invisible.

    This does not work:
    @media onlyScreen and (max-width: 989px) {#start .av-parallax .av-parallax-inside {background-image: none! Important; }}

    And this is only on desktop:
    @media onlyScreen and (max-width: 768px) {
    #start {background-image: none! Important; }}

    Can someone help
    Merci, Jürgen

    April 9, 2017 at 9:28 am #774828
    Rikard

    Hey winnerl,

    Your media queries don’t look right, try something like this instead:

    @media only screen and (max-width: 767px) {
 YOUR CODE HERE
}

    That will apply to mobile screens.

    Best regards,
    Rikard

    April 9, 2017 at 3:01 pm #774977
    Jürgen

    Hey Rikard,
    merci.
    “YOUR CODE HERE” … which code should I enter here?
    Section ID for color section is: “start”
    Please help

    Best Regards,
    Jürgen

    April 9, 2017 at 3:47 pm #774989
    Jordan Shannon

    Hi,
    ‘
    Yes Rikard has corrected the media query so you would want to enter the following:

    #start {background-image: none! Important; }

    Best regards,
    Jordan Shannon

    April 9, 2017 at 4:18 pm #775001
    Jürgen

    Hi,
    Ok, the code is now in “quick CSS”:

    @media only screen and (max-width: 767px) {
    #start {background-image: none! Important; }

    The ID is: start

    But it does not work, the image is still visible on my iphone.
    Something I do wrong!

    Best Regards,
    Jürgen

    April 9, 2017 at 4:25 pm #775004
    Jordan Shannon

    Hi,

    The code should be this:

    @media only screen and (max-width: 767px) {
#start {background-image: none! Important; }
}

    It looks like you missed a bracket above.

    Best regards,
    Jordan Shannon

    April 9, 2017 at 4:35 pm #775011
    Jürgen

    doesn’t work like this
    @media only screen and (max-width: 767px) {
    #start {background-image: none! Important; }
    }

    April 9, 2017 at 4:42 pm #775014
    Jordan Shannon

    Hi,
    You want to hide the face in the background?

    Best regards,
    Jordan Shannon

    April 9, 2017 at 4:53 pm #775019
    Jürgen

    oh yes

    April 9, 2017 at 5:15 pm #775030
    Jordan Shannon

    Hi,

    Okay if thats the case that has nothing to do with hiding the color section, you would need to hide or change the entire background on mobile

    Best regards,
    Jordan Shannon

    April 9, 2017 at 5:57 pm #775048
    Jürgen

    Thanks Jordan,
    Sure you are right. Or only the image invisible?
    Does anybody have a solution?

    Merci
    Jürgen

    April 9, 2017 at 6:08 pm #775053
    Jordan Shannon

    Hi,

    Try the following to remove the face from all sections on mobile:

    @media only screen and (max-width: 767px) {
    .avia-section{
    background-image:none!important;
    }
    }

    Best regards,
    Jordan Shannon

    April 9, 2017 at 7:02 pm #775078
    Jürgen

    Hi Jordan,
    I have tested. But does not work.

    Best Regards
    Jürgen

    April 9, 2017 at 7:19 pm #775084
    Basilis

    Hey!

    Can you please try as

    @media only screen and (max-width: 767px) {
.avia-section{
background: none!important;
background-image: none!important;
}
}

    and let us know if it works

    Cheers!
    Basilis

    April 9, 2017 at 9:43 pm #775125
    Jürgen

    Hey Basilis,
    sorry
    I have tested. But doesn’t work.
    I think the problem is the mobile implementation.

    Kind Regards.
    Jürgen

    April 9, 2017 at 10:06 pm #775135
    Jordan Shannon

    Hi,

    Would you be able to provide log info so we can look into this further.

    Best regards,
    Jordan Shannon

    April 9, 2017 at 11:51 pm #775175
    Jürgen

    Hi Jordan,
    Yes, see private content. let me know if you need FTP-Login.

    Best Regards,
    Jürgen

    April 10, 2017 at 10:32 pm #775682
    Jordan Shannon

    Hi,

    I have added the following to quick css which seems to have met your goal:

    @media only screen and (max-width: 767px)  {
.avia-section{
background-image:none!important;
}
}

    Let me know if this is correct.

    Best regards,
    Jordan Shannon

    April 11, 2017 at 12:53 am #775740
    Jürgen

    Hi Jordan,
    Thank you for your help.
    Does it work on your smartphone? On my not. I’ve tested it on smartphone in Safari and Firefox, but the image is still visible.

    Best Regards,
    Jürgen

    April 11, 2017 at 11:43 am #775952
    Victoria

    Hi Jürgen,

    Please clear the cache on your device or try on different device, and get back to us.

    Here are is how you can do it:
    https://support.wix.com/en/article/clearing-your-browsers-cache-on-a-mobile-device
    https://www.wondershare.com/mobile-phone/how-to-clear-cache-on-android-devices.html

    If you need further assistance please let us know.
    Best regards,
    Victoria

    April 11, 2017 at 12:26 pm #775967
    Jürgen

    Hi Victoria,
    I have tested the page on another smartphone.
    In addition, I have installed WP Super Cache and emptied the cache.
    But the picture still appears.

    Best Regards
    Jürgen

    April 11, 2017 at 2:56 pm #776074
    Jordan Shannon

    Hi,

    Is it appearing in the entire background, or just the top section in white? Perhaps we have miscommunication.

    Best regards,
    Jordan Shannon

    April 11, 2017 at 4:56 pm #776182
    Jürgen

    Hi, Jordan,
    correct. It is the upper section in white, where the image is installed as a background image. The other sections in the homepage below also have background pictures and should be invisible on mobile.

    Best Regards
    Jürgen

    April 11, 2017 at 5:07 pm #776194
    Jordan Shannon

    Is the white section the only one that still needs corrected on mobile. I am not seeing images on the other sections on mobile. Only colors.
    Best regards,
    Jordan Shannon

    April 11, 2017 at 5:54 pm #776216
    Jürgen

    No, the other sections also contain pictures, you can see it on desktop.
    These pictures should not be visible on mobile either.

    April 11, 2017 at 6:05 pm #776222
    Jordan Shannon

    Hi,

    Please provide mobile screens of the other sections with images. I see them on the desktop, but on mobile they are completely removed. 

    Best regards,
    Jordan Shannon

    April 11, 2017 at 6:06 pm #776223
    Jordan Shannon

    Hi,

    On mobile I only have solid background colors with no images which is what it sounds like you wanted?

    Best regards,
    Jordan Shannon

    April 11, 2017 at 6:28 pm #776241
    Jürgen

    Is apparently a misunderstanding. On the mobile you can see the ear from the face far right. If you rotates the smartphone, you can see the face.
    Thats the Problem.
    That means the face is still visible on mobile. And I do not want that.
    Sorry for my bad english ;-)

    Greetings Jürgen

    April 11, 2017 at 6:43 pm #776250
    Jordan Shannon

    Hi,

    I have updated it to the following. Please try and do a hard refresh:

    @media only screen and (max-width: 767px)  {
.avia-section{
background-image:none!important;
}

.av-parallax.avia-full-stretch.active-parallax{
background-image:none!important;
}
}

    Best regards,
    Jordan Shannon

    April 11, 2017 at 6:57 pm #776260
    Jürgen

    … yeeeeeeeeeeeeeees
    Super, you got it. Perfect!!!

    Thanks to the Team Enfold
    Especially to Jordan

    Best Regards, Jürgen

  • Author
    Posts
Viewing 30 posts - 1 through 30 (of 31 total)
1 2
  • You must be logged in to reply to this topic.