Hello,
I have the following problem:
My landing page is composed of 2 images: a background image (top-banner) assigned to the body element and another image where I am presenting my content.
My problem is that both images are quite large and always, I have to wait for the main image to show up first, and than the background image.
This is very annoying for my and it does not look nice.
I have created an online version with sample images that clearly show my problem. Please check it: [here][1] [1]: http://tinyurl.com/yjerdl9
I have tried many different JavaScript techniques and online solutions, but none of them solved my problem.
All I want is the background image to show first, and than the main image.
Here is the html code:
<body background='top-banner2.jpg' style='background-position: top center; background-repeat:no-repeat;'>
<a href="#">
<img border='0' style='position:absolute; width:965px; left:50%; margin-left:-487px; top:440px;' src='main2.jpg' />
</a>
</body>
I am open to any solution, JavaScript, AJAX, whatever, just to see it working!
Thank you for sharing your time and expertise.
All the best, Spiro K.