Before you ask please READ THIS

Nav Anchore / Menu / SubMenu & Safari 5.1.10 issues

in Chillout Posts: 54
Hi Apollo,

We have been very happy with the Chillout Theme after building our main company website with it.
We have now purchased x2 more licenses and are building 2 more sites for our sister companies.

All 3 sites share the same custom code to the js folder (scripts.js, bootstrap-modal.js) and the plugins folder, Chillout-plugin (script.js) which enables us to have a custom header height above the menu bar and disables the "shield".

There are a couple of issues we are having with the 2 new sites which we cant seem to figure out, we would appreciate any advice you are able to share on who we can fix these issues.

General issues across all 3 sites:
Safari 5.1.10:
• Fonts change from bold to thin on scroll.
• The clients section - when you hover on the logos to flip/reveal the text, the logo is shown in reverse.
• The Row Titles are left aligned with the separator lines missing?


Site specific issues:

On Site 1: (http://tinyurl.com/jtjggzw)
As above general issues when viewed in Safari 5.1.10
Otherwise works really well - and are very happy with this site, that is why we decided to purchase x2 more licenses for our sister companies. :)


On Site 2: (http://tinyurl.com/jyoy688)
The site is built with x3 one page layouts (Home, Training & Consulting) and uses submenus.

All of the above Safari 5.1.10 issues:
• Fonts change from bold to thin on scroll. (Especially noticeable on Menu items and on home page "We specialise in" section in dark blue.
• The clients section - when you hover on the logos to flip/reveal the text, the logo is shown in reverse.
• The Row Titles are left aligned with the separator lines missing?

Main issues on all browsers:
• Navigating to sub menu item from different page (not home page):
This is inconsistent results. From "Home" page If you click on "Training" menu item, scroll around, then click on "Consulting" Sub Menu item i.e "Responsible Person". It displays a white page with "Comments are closed". like it is loading a blog page and not the relating nav anchor point on the consulting page. This happens alot when navigating to a submenu page.

• How can I disable the menu items from "bouncing/moving" Id like the menu items to stay static.

• How can I change the colour of the black underline - under the menu items? - Id like to change this to orange like on the submenu over/select.


On Site 3: (http://tinyurl.com/zlhsosl)
As above general issues when viewed in Safari 5.1.10

Main issues: on all browsers
• Fonts change from bold to thin on scroll. (Especially noticeable on Menu Text)
• When navigating away from "Home" page to "Social" page, the nav anchors do not stop at the top of the row as they do on the home page.


I look forward to hearing back from you.
Keep up the good work, We Love This Theme!

Mandy

Comments

  • Posts: 1,758
    Hello Mandy,
    what a nice, elaborated report, thanks!
    Safari 5.1.10 is not supported anymore, but I this this issue can be fixed
    Let's take a second website (http://tinyurl.com/jyoy688) first:
    Mandy said: Fonts change from bold to thin on scroll.
    This is Safari issue - 5.1.10 is rather obsolete and I'm simply not able to check your website on this browser BUT I can guide You. Please refer to http://stackoverflow.com/questions/21278020/font-weight-turns-lighter-on-mac-safari
    this is possible solution, just add this body {-webkit-font-smoothing: subpixel-antialiased;}at the top of your custom style file

    Mandy said: The clients section - when you hover on the logos to flip/reveal the text, the logo is shown in reverse.
    This is so wierd. Chrome is OK, but on latest FireFox it looks even more odd - the background looks sometimes as it's like mixture of backgrounds of several testimonial items that are next to one hovered... strange.
    All I know - there nothing like this on pure Chillout, so I assume that there's something messed up with rendering-related css definition. Still trying to track the source of this glitch, not able to fix it for You now.
    Mandy said: • The Row Titles are left aligned with the separator lines missing?
    As above - can't check it, can't confirm it, can't test it. But I suspect it has something to do with 'flex' display mode.
    please try to add this definition to your custom css file:
    .vc_separator .vc_sep_holder {
        -webkit-box-flex: 1;
        -webkit-flex: 1 1 auto;
            -ms-flex: 1 1 auto;
                flex: 1 1 auto;
        height: 1px;
        min-width: 10%;
        position: relative;
    }
    Mandy said: Navigating to sub menu item from different page (not home page):
    This is a bug, thank You! It'll be fixed in upcoming update.
    Mandy said: How can I disable the menu items from "bouncing/moving" Id like the menu items to stay static.
    Use this:
    .top-menu > .menu-item:hover > a > span, .top-menu > .menu-item.active > a span, .top-menu > .menu-item.current-menu-item > a span{
    top:0!important;
    }
    .top-menu .menu-item a:not(.a13_menu_icon)::before {
      content: "" !important;
    }
    Mandy said: • How can I change the colour of the black underline - under the menu items? - Id like to change this to orange like on the submenu over/select.
    Use this:
    
    .top-menu > .menu-item:hover::after, .top-menu > .menu-item.active::after, .top-menu > .menu-item.current-menu-item::after {
    border-color: #cd3838 !important;
    }
    Remember to rate our theme if you like it ;)
    All the Best.
  • Posts: 1,758
    Hi again

    as for website http://tinyurl.com/zlhsosl:
    Mandy said: • Fonts change from bold to thin on scroll. (Especially noticeable on Menu Text)
    As above, in my first comment - try this css trick and let me know if it helped.
    Mandy said: • When navigating away from "Home" page to "Social" page, the nav anchors do not stop at the top of the row as they do on the home page.
    Can't figure out what's wrong. Please provide some screenshots.
    Remember to rate our theme if you like it ;)
    All the Best.
  • Posts: 54
    Hi Surgeon,

    Many thanks for your fantastic support on this.
    Sadly the Safari 5.1.10 CSS tricks didn't work ..

    Resolved:
    Keeping menu items static on Site 2
    Changing colour of underline in menu on Site 2 & 3

    Unresolved Safari 5.1.10 issues:
    • Row Titles left align with separator text missing - (This is still an issue on Site 2)
    • Font change from bold to thin on scroll - (This is less noticeable as we have changed the font on Site 3)
    But is still noticeable on Site 2 - "We specialise in" on the home page.

    Still an Issue:
    Site 1 (http://tinyurl.com/jtjggzw) & Site 2 - (http://tinyurl.com/jyoy688)
    • Client section - In latest Firefox & old version Safari 5.1.10 this is still looking odd with a mixture of background images showing through the text. - Fine on later Safari (6.2 +) and Chrome.

    Site 2 - (http://tinyurl.com/jyoy688)
    • Navigating to sub menu item from different page (not home page). (Loading "No comments/Blog" page when navigate to submenus) This is inconsistent results. From "Home" page If you click on "Training" menu item, scroll around, then click on "Consulting" Sub Menu item i.e "Responsible Person". It displays a white page with "Comments are closed". like it is loading a blog page and not the relating nav anchor point on the consulting page. This happens a lot when navigating to a submenu page. I Look forward to theme update to fix this bug. Ive attached screen shot for reference.

    Clarification:
    On Site 3 - (http://tinyurl.com/zlhsosl)
    Mandy said:
    • When navigating away from "Home" page to "Social" page... - Back to Home page - the nav anchors do not stop at the top of the row as they do on the home page. Sorry I did not specify it is when you navigate back to the home page from social. So i.e click contact from the social page.

    Further to this - I have discovered it happens on first click of a nav anchor on initial load of page. So if visit website from first time and click "What we do" it doesn't stop at top of nav anchor - there is gap above, same happens when you navigate to "Social" page, and click back on nav anchor on home page i.e "Creative" it doesn't stop at top of nav anchor - there is gap above. i have checked all our nav actors and the row settings.
    I've attached screenshot for ref (Our additional head height on Site 3 is 195px)

    New Issue:
    I have noticed on Site 2 & 3 - When left idle/alone for a few minutes (say 10min) and you go back to it - the menu items don't work. You need to hard reload the page for the menu items to work/be active. We don't have this issue on Site 1 (Not that I've noticed).

    I've attached a bunch of screen shots to hopefully help explain some of the issues better.

    Many thanks again for all your hard work!

    I look forward to the new update - do you know roughly when this might be released?
    As we are hoping to launch both these new sites live very soon.

    Mandy
    Site 2 - Submenu Nav to No Comments:blog.png
    1432 x 601 - 40K
    Site 3 - Nav anchor not stopping at top of row.png
    1261 x 944 - 365K
    Site 2 - Firefox - Clients logo:text box issue.png
    1400 x 885 - 278K
    Site 2 - Safari 5.1.10 - Clients logo:text box issue 1:2.png
    1920 x 1080 - 616K
    Site 2 - Safari 5.1.10 - Clients logo:text box issue 2:2.png
    1920 x 1080 - 591K
    Site 1 - Row Titles - Left aligned no separator lines.png
    1889 x 877 - 138K
  • Posts: 1,758
    Hello Mandy!
    Mandy said: I look forward to the new update - do you know roughly when this might be released?
    Soon, I thing that it'll prepared by the end of the current week, but it might take few days to approve it by ThemeForest team. This is how it works.

    As for other issues: You can count on me, I'll do my best to help You find the source of those glitches, but You also need to understand, that those glitches are something unique, and are present on your websites only.
    I've double checked this and
    - no font-related issues (You can dig more about this by browsing 'safari font change weight' search results in google),
    - no glitches in 'clients' section
    - no problems in page scrolling.
    So I simply assume that those are because of some modifications You've made.
    Perhaps it's good idea to make another pure Chillout installation, and try to check - step by step - which modification of yours is breaking things.
    I'll try to find out what causes problems on you websites, but this is out of range of support, so please be patient, I'll do this in spare time.
    Remember to rate our theme if you like it ;)
    All the Best.
  • Posts: 54
    Hi Surgeon,

    Thanks for the heads up on the update - we will keep an eye out for it from next week.
    Thank you, we are very greatful for all the advice given so far and appreciate any suggestions too.
    We will also keep trying to solve the issues ourselves and if we find anything or resolve anything in the meantime we will keep you updated.

    Thank you
  • Posts: 54
    Hi Surgeon,

    Thank you for the update!
    The new update has resolved the menu issue we were having on Site 2 - (http://tinyurl.com/jyoy688).
    • Navigating to sub menu item from different page (not home page). (Loading "No comments/Blog" page when navigate to submenus)

    Many Thanks!
Sign In or Register to comment.

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

In this Discussion