Блог

Я пытаюсь заставить цвет фона css исчезать сразу после загрузки страницы без какого-либо взаимодействия с пользователем. Можно ли это сделать?

Это можно сделать с помощью анимации CSS. Существует свойство animation-delay, которое можно установить в секундах.

 animation-delay: 2s;
-webkit-animation-delay: 2s;
-moz-animation-delay: 2s;
-o-animation-delay: 2s;
 

Вот простой пример исчезновения фона через 2 секунды: http://jsfiddle.net/eKAf2 /

Лично я бы установил фон в CSS. Затем измените документ с помощью jQuery. Поэтому я бы установил цвет фона

CSS

 body {
    background: #009dff;
}
 

Затем установите цвет фона, в который будет исчезать страница, и добавьте переход

JS

 $(document).ready(function() {
   $("body").css("transition", "3s"); // Adding transition
   $("body").css("background", "#fff"); //Background color to fade into 
}); 
 

Плюс вот демонстрация.

С помощью чистого JS вы можете использовать onload в теле и настроить функцию, а затем вызвать ее таким образом.

Если у вас был элемент, например: .elem

 <div class="elem"></div>
 

Стили:

 .elem {
  width: 100px;
  height: 100px;
  background: red;
 }
 

У вас может быть класс css eh .nobackground, который делает фон прозрачным с переходом.

 .nobackground {
  background: transparent !important;
  transition: all 1s;
}
 

Затем вы можете применить этот класс к элементу при загрузке страницы с помощью jquery.

 $(document).ready(function(){

   $(".elem").addClass("nobackground");

});
 

Вот корзина. Надеюсь, это поможет.