при добавлении спин (spin.js) - веб-страницы теряют функциональность

Question

Пожалуйста, мне нужна помощь о спиновой функции (с помощью spin.min.js сценария)

Проблема возникает, когда я добавил его к моей веб-страницы, веб-страницы Логе функциональность - Я не может нажимать на какую-либо ссылку и не может отмечать что-либо с помощью мыши. Я не знаю, в чем проблема, пожалуйста, помогите мне.

SCRIPT в теге BODY

<script src="js/vendor/spin.min.js"></script> 

HTML

<div class="loading loading-out"> 
    <div id="spin"> 
    </div> 
</div> 

CSS

.loading{ 
background: #F7F7F7; 
width: 100%; 
height: 100%; 
position: fixed; 
top: 0; 
left: 0; 
z-index: 500; 


.loading-out{ 
-webkit-opacity: 0; 
-moz-opacity: 0; 
opacity: 0; 
-webkit-transition: all 1s ease; 
-moz-transition: all 1s ease; 
-ms-transition: all 1s ease; 
-o-transition: all 1s ease; 
transition: all 1s ease; 


#spin{ 
margin: 0px auto; 
position: absolute; 
left: 50%; 
top: 50%; 

Jquery

$(function() 

    $(window).load(function() { 
     // Fadeout loading 
     $('.loading').addClass('loading-out'); 

     // Hide loading 
     setTimeout(function() { 
      $('.loading').hide(); 
     }, 800); 
    }); 

Answer 1

1. Ваши определения CSS должны быть заключены в {}. Прямо сейчас это только { без закрытия }
2. Отсутствует анонимная функция jQuery {}. Изменение $(function() /* window load */ до $(function() {/* window load */}).

Проверьте панель инструментов инструментов, чтобы узнать, есть ли ошибки. Возможно также, что ваш JS занимает огромное количество памяти, а браузер все еще выполняет JS, пока вы пытаетесь взаимодействовать с ним.
Проверьте, загружен ли jQuery перед любым скриптом, который использует $.