ANTICHAT - Прелоад на одном лишь html

Цитата:

Сообщение от Fermin

Привет, прелоадер можно сделать так:

HTML:

Код:

 -->



#preloader{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#fff;z-index:999999}

.canvas{position:absolute;margin:auto;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}

.loader-logo{display:block;width:120px;margin-bottom:25px}

.spinner{animation:spinner 1s linear infinite;border:solid 5px transparent;border-top:solid 5px #5d5386;border-radius:100%;width:60px;height:60px;margin:0 auto}@keyframes spinner{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}

.blockquote{padding:.5rem 1rem;margin-bottom:1rem;font-size:.85rem;border-left:.25rem solid #eceeef}



Тут может быть пикча (o-o)



Кукусики

Как работает:

Архив с HTML и двумя JS я прикрепил к ответу. Удачи ;)

Опробую.

Цитата:

Сообщение от Fermin

Привет, прелоадер можно сделать так:

HTML:

Код:

 -->



#preloader{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#fff;z-index:999999}

.canvas{position:absolute;margin:auto;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}

.loader-logo{display:block;width:120px;margin-bottom:25px}

.spinner{animation:spinner 1s linear infinite;border:solid 5px transparent;border-top:solid 5px #5d5386;border-radius:100%;width:60px;height:60px;margin:0 auto}@keyframes spinner{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}

.blockquote{padding:.5rem 1rem;margin-bottom:1rem;font-size:.85rem;border-left:.25rem solid #eceeef}



Тут может быть пикча (o-o)



Кукусики

Как работает:

Архив с HTML и двумя JS я прикрепил к ответу. Удачи ;)

Я не иогу поставить(

Цитата:

Сообщение от Fermin

Привет, прелоадер можно сделать так:

HTML:

Код:

 -->



#preloader{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#fff;z-index:999999}

.canvas{position:absolute;margin:auto;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}

.loader-logo{display:block;width:120px;margin-bottom:25px}

.spinner{animation:spinner 1s linear infinite;border:solid 5px transparent;border-top:solid 5px #5d5386;border-radius:100%;width:60px;height:60px;margin:0 auto}@keyframes spinner{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}

.blockquote{padding:.5rem 1rem;margin-bottom:1rem;font-size:.85rem;border-left:.25rem solid #eceeef}



Тут может быть пикча (o-o)



Кукусики

Как работает:

Архив с HTML и двумя JS я прикрепил к ответу. Удачи ;)

Я не иогу поставить(