Strange safari rendering issues, and low performan

Question

I'm in the middle of development of a website, however I cannot work out what is causing this plethora of issues.

In Safari on OS X (7.0.6 on 10.9.4), random elements will disappear and reappear and hovering over the drop down menu, or a button, they suddenly re-appear. It is very strange and erratic.

In Chrome (v36.0.1985.143) and Firefox (v31.0) the scrolling performance is poor, but no rendering issue.

All onscroll events are clean. I've tried tweaking with just about everything and gotten nowhere.

If anybody can work this out, I'll be greatly appreciative. Thanks in advance.

Answer 1

I don't see any scrolling performance issue on chrome or firefox, but I noticed Safari rendering glitches.

When you force reflow, all your sections are displaying again. Try to add a backface-visibility:hidden; on your .section class.

Edit:

Your #background-area is fixed and doesn't have any z-index. Put it to z-index: -1; to keep it in the back.