Viewing 15 posts - 1 through 15 (of 15 total)
  • Author
    Posts
  • July 3, 2014 at 8:01 am #286527
    pako69

    Hello
    I have some screenshots to show to you.
    It’s about the visibility of the semicircle anchor when I use the Fullscreen Slider AND header transparent or not.

    1/ iPhone 5 – header transparent: no > it’s ok
    iPhone - header transparent: no

    2/ iPhone 5 – header transparent: yes > the anchor is not visible
    iPhone - header transparent: yes

    3/ iPad 2 – header transparent: yes / orientation: landscape > the anchor is partially visible
    iPad - header transparent: yes / orientation: landscape

    4/ iPad 2 – header transparent: yes / orientation: portrait > it’s ok
    iPad - header transparent: yes / orientation: portrait

    What do you thonk of that?
    Thank you.

    July 7, 2014 at 5:01 am #287821
    Devin

    Hi pako69!

    I’ll tag the topic for Kriesi as I’m not currently getting that same thing when I view the site on my personal ipad or with any emulators.

    For the screenshots, is it on first load of the page/refresh with each orientation or with the page live and then you turn the screen?

    Best regards,
    Devin

    July 7, 2014 at 8:06 am #287852
    pako69

    Hello Devin
    Yes it it on first load.
    Here another screenshot, on my iPhone 5S but not with Safari, it’s Chrome:
    iphone 5s portrait Google Chrome
    Thank you

    July 8, 2014 at 1:21 pm #288486
    Yigit

    Hi!

    Please try adding following code to Quick CSS in Enfold theme options under General Styling tab

    @media only screen and (max-width: 767px) {
.responsive #top #header {
position: absolute;
}}

    then please flush browser cache on your mobile device and refresh your page a few times

    Cheers!
    Yigit

    July 8, 2014 at 3:43 pm #288561
    pako69

    Hello Yigit
    Well.. it works only for iPhone and only for the homepage… If I keep your CSS for the whole site: all my pages/posts layouts are broken because all content goes on top… /-)
    So I use:
    .responsive #top.home #header {position: absolute;}

    (note that it do not change anything for the the iPad/landscape), i always have this:

    July 8, 2014 at 3:48 pm #288566
    Yigit

    Hey!

    Please try

    @media only screen and (max-width: 1024px)  {
.responsive #top.home #header {position: absolute; }}

    Cheers!
    Yigit

    July 8, 2014 at 3:50 pm #288567
    pako69

    I had already done but it does not change anything

    July 9, 2014 at 5:13 am #288813
    Ismael

    Hey!

    Thank you for using the theme.

    I don’t see the issue on iPad or iPod touch 5 which has same exact resolution as iPhone if I am not mistaken. The next section arrow is visible on those two devices, landscape or portrait. I don’t want to suggest changing the bottom position of the anchor link but if you want you can try this:

    .avia-ipad #top .scroll-down-link {
bottom: 20px;
}

    Or for iPhone:

    .avia-iphone #top .scroll-down-link {
bottom: 20px;
}

    Cheers!
    Ismael

    July 9, 2014 at 4:33 pm #289079
    pako69

    Hello Ismael
    I’m afraid you are not talking about the same thing as me…
    You are talking about the scroll-down-link but no me.
    Here is a screenshot from a new iPad Air:

    July 10, 2014 at 6:10 am #289334
    Ismael

    Hi!

    Thank you for the screenshot.

    Yes, we’re talking about that thing. I just call it scroll-down-link or arrow base on its selector. I’ll ask the rest of the support team to check it. It renders fine on iPad and iPod touch using Chrome browser.

    Regards,
    Ismael

    July 15, 2014 at 8:35 am #291435
    KattaC

    Hi guys,

    I would just like to add that I’m experience the exact same thing on my iPad Air in landscape mode, with Safari. Would love to know how to fix this…

    Cheers,
    Katta

    July 15, 2014 at 8:40 am #291437
    pako69

    @KattaC
    ;-)

    July 18, 2014 at 10:23 am #292889
    KattaC

    @pako69 – maybe you could try this in your style.css:

    @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation:landscape) {
    .avia-ipad #top .scroll-down-link {bottom: 20px;}
    }
    Worked for me. It seems there’s a bug in Safari that adds extra 20px space to height to the fullscreen slider element and that’s why the scroll to next section icon seems to disappear below the screen.

    Don’t know if this is the most graceful solution, but it does seem to work on my iPad with Safari in landscape mode without affecting Chrome that works just fine as it is.

    July 20, 2014 at 10:54 am #293589
    pako69

    Hello @Kattac
    Thanks for the tips, it works BUT it also target Chrome :-(
    .avia-ipad is a class you have had to the fullscreen slider ?

    July 21, 2014 at 5:23 pm #293922
    Dude

    Hi!

    You can try to add the webkit class to exclude Chrome like:

    
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation:landscape) {
.avia-webkit.avia-ipad #top .scroll-down-link {bottom: 20px;}
}

    Cheers!
    Peter

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