0
У меня есть страница с контейнером с вертикальной прокруткой, и я хочу добавить анимацию загрузки на видимую часть страницы над контейнером. Я попробовал div с классом:Показать анимацию загрузки на видимой части центра страницы
.loading-animation {
height:100vh;
background: url(img/loading.gif) 50% 50%/100px 100px fixed no-repeat;
}
но он появился в нижней части страницы, под моим контейнером. Затем я попробовал
.loading-animation {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 10;
background: url('img/loading.gif') 50% 50%/100px 100px no-repeat;
}
, и это появилось над моим контейнером, но в середине всей страницы, а не в видимой области. Любые идеи, как достичь этого оценили
edit1, JavaScript:
var loading_animation;
function showLoadingAnimationModal() {
loading_animation = document.createElement("div");
loading_animation.style.cursor = "progress";
loading_animation.className = "loading-animation";
document.body.appendChild(loading_animation);
}
function hideLoadingAnimationModal() {
if (loading_animation.parentNode == document.body) {
document.body.removeChild(loading_animation);
}
}
HTML шаблон (с использованием emberjs):
<script type="text/x-handlebars">
<div align="center">
{{outlet}}
{{#if errorMessage}}
<div class="alert alert-danger" role="alert">
{{errorMessage}}
</div>
{{/if}}
</div>
</script>
<script type="text/x-handlebars" data-template-name="login">
<div class="container">
<!--skipped elements-->
</div>
</script>
Покажите нам ваш HTML код –
использовать компонент для отображения загрузки кок внутри/выше вашего 'container' элемента. Использование javascript или jquery для добавления в документ против зерна в ember. – Grapho