Javascript preloader problem

JavaScript
1

I have a site where I’m using a preloader. It doesn’t appear to work properly. The page loads for a brief second. Then the preloader shows up. Then the page REappears. Here is the site: http://estevancarlos.com/

How do I resolve it?

Code

function show(id, value){
    document.getElementById(id).style.opacity = value ? 'opacity' : 0.0;
};

onReady(function () {
    show('overlay', false);
    show('page', true);
    show('loader', false);
    removeBlock('loader', false);
});

Then I have some CSS for the animation:

#loader {
  border: 10px solid #FFCEDC;
  border-top: 9px solid #c6a466;
  border-radius: 50%;
  width: 50px;
  height: 50px;
  animation: spin 2s linear infinite;
  margin: 30px;
  position: absolute;
  z-index: 100; }

#overlay {
  background-color: rgba(255, 206, 220, 0.8);
  width: 100%;
  height: 100%;
  position: fixed; }
2

The string "opacity" is not a valid value for the opacity… that should probably be the number 1.

3

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.