Перейти к содержимому


Фото
- - - - -

preloader для сайта криво отображается


  • Чтобы отвечать, сперва войдите на форум
6 ответов в теме

#1 Julius123

Julius123
  • Пользователь
  • 249 сообщений
  • Заказчик, Пользователь
  • Версия CMS:2.x
  • Откуда:Украина

Опубликовано 27.11.2017 - 22:06

Всем привет. Используют прелоадер для сайта но он почему-то отображается при разных разрешениях экрана по разному, то по центру, то сбоку, может подскажите с чем это связано? Уже голову сломал.

 

{* preloader *}
<div id="p_prldr">
<span class="svg_anm"></span>
</div>
<script type="text/javascript">$(window).on('load', function () {
    var $preloader = $('#p_prldr'),
        $svg_anm   = $preloader.find('.svg_anm');
    $svg_anm.fadeOut();
    $preloader.delay(500).fadeOut('slow');
});
</script>
#p_prldr {
position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #fefefe;
    z-index: 99999;
    height: 100%;
    width: 100%;
    overflow: hidden !important;
}
.svg_anm {
    width: 175px;
    height: 70px;
    position: absolute;
    top: 45%;
    left: 45%;
    background: url(../images/preloader.gif) center center no-repeat;
     background-size:150px;
    background-position:center;
}

 



#2 chocolate_moles

chocolate_moles
  • Фрилансер
  • 406 сообщений
  • Верстка
  • Версия CMS:2.x
  • Откуда:Санкт-Петербург

Опубликовано 27.11.2017 - 22:26

Уже голову сломал.

 

.svg_anm {
  width: 175px;
  height: 70px;
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -82px 0 0 -35px;
  background: url(../images/preloader.gif) center center no-repeat;
  background-size:150px;
  background-position:center;
}


#3 Julius123

Julius123
  • Пользователь
  • 249 сообщений
  • Заказчик, Пользователь
  • Версия CMS:2.x
  • Откуда:Украина

Опубликовано 27.11.2017 - 23:16

.svg_anm {
  width: 175px;
  height: 70px;
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -82px 0 0 -35px;
  background: url(../images/preloader.gif) center center no-repeat;
  background-size:150px;
  background-position:center;
}

Это ничего не дало, я специально поставил top и left 45% потому что так более менее по центру, а при 50% больше вбок уходит. с небольшого разрешения экрана вообще сбоку


Изменено: Julius123, 27.11.2017 - 23:17


#4 mishanya

mishanya
  • Фрилансер
  • 2 434 сообщений
  • Программирование, Верстка
  • Версия CMS:2.x
  • Откуда:Ukraine

Опубликовано 27.11.2017 - 23:21

Это ничего не дало, я специально поставил top и left 45% потому что так более менее по центру, а при 50% больше вбок уходит. с небольшого разрешения экрана вообще сбоку

 

а кеш обновили? там для центровки специально стоит отступ в половину лоадера margin: -82px 0 0 -35px;



#5 Julius123

Julius123
  • Пользователь
  • 249 сообщений
  • Заказчик, Пользователь
  • Версия CMS:2.x
  • Откуда:Украина

Опубликовано 27.11.2017 - 23:26

а кеш обновили? там для центровки специально стоит отступ в половину лоадера margin: -82px 0 0 -35px;

Да, почистил кэш и проверил что новые стили загрузились



#6 Julius123

Julius123
  • Пользователь
  • 249 сообщений
  • Заказчик, Пользователь
  • Версия CMS:2.x
  • Откуда:Украина

Опубликовано 27.11.2017 - 23:37

а кеш обновили? там для центровки специально стоит отступ в половину лоадера margin: -82px 0 0 -35px;

Ширина картинки ширина 175жет, высота 70. Может это помо



#7 chocolate_moles

chocolate_moles
  • Фрилансер
  • 406 сообщений
  • Верстка
  • Версия CMS:2.x
  • Откуда:Санкт-Петербург

Опубликовано 28.11.2017 - 00:43

Ширина картинки ширина 175жет, высота 70. Может это помо

 
уфф, должно быть вот так

margin: -35px 0 0 -87px;





0 пользователей читают эту тему

0 пользователей, 0 гостей, 0 скрытых