Создайте полноэкранное изображение загрузки для веб-сайта AngularJS - PullRequest
Новая
       22

Создайте полноэкранное изображение загрузки для веб-сайта AngularJS

0 голосов
/ 26 апреля 2018

Я хочу показать полноэкранное изображение до полной загрузки моего веб-сайта AngularJS.

Один из способов - использовать ng-cloak.

Это пример чтобы показать строку слов.

Я попытался вместо этого сделать полноэкранное изображение 

[ng-cloak].splash {
    /* The image used */
    background-image: url("https://media.thetab.com/blogs.dir/13/files/2017/02/nice-guy-2.jpg");

    /* Full height */
    height: 100%; 

    /* Center and scale the image nicely */
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

http://plnkr.co/edit/OTYwqGehVAsw5R8V?preview

Но это не сработало.Кто-нибудь знает почему?

1 Ответ

0 голосов
/ 26 апреля 2018

Вы пропустили display: block !important; в [ng-cloak].splash

[ng-cloak].splash {
    /* The image used */
    background-image: url("https://media.thetab.com/blogs.dir/13/files/2017/02/nice-guy-2.jpg");

    /* Full height */
    height: 100%; 

    /* Center and scale the image nicely */
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    display: block !important;
}

http://plnkr.co/edit/oiGcMrO18nMt8KmM1d6X?preview&p=preview

...