Hi there!
I’ve designed a website http://wiserproperty.com/ with a view to have a transparent header (until you scroll down).
It works fine on Safari, and from time to time, it works on Chrome too… recently for some reason (perhaps an update?) a white space appears at the top of the page on Google Chrome. Any ideas on what is causing this and how to remedy it?
How it should look (working in Safari): https://www.dropbox.com/s/ct3leglwvvxyxkj/safari-no-problem.png
Broken in Chrome: https://www.dropbox.com/s/fen9due96ur54la/chrome-white-space.png
Thanks a lot! :-)
Kind regards,
Andreas
Hey Andreas!
I checked your website on Chrome Version 35.0.1916.153 and this is how it looks on my end – http://i.imgur.com/VDE3e2a.jpg
Which version of OS X and Chrome are you using?
Best regards,
Yigit
Hi Yigit,
Thanks for your reply – I’m using 10.9.4 – the latest version – with the latest version of Chrome.
The strange thing about this issue is that it is intermittent. Sometimes when I refresh the problem disappears. The problem also appears on other peoples’ computers using Chrome – but not always.
Do you have any knowledge of any other people with issues with the transparent header?
Thanks once again for your time! :-)
Kind regards,
Andreas
Hi Andreas,
I could note it a few times and it gets fixed if the window is resized, try adding this at the very end of your theme functions.php file:
function add_custom_script(){
?>
<script>
jQuery(window).load(function(){
jQuery(window).trigger('resize');
});
</script>
<?php
}
add_action('wp_footer', 'add_custom_script');
Regards,
Josue
Hello Josue,
This code appears to have fixed the issue. Thank you and Yigit for your help with this!
Have a great day :-)
Kind regards,
Andreas