Как заменить анимацию загрузки страницы

Тема в разделе "Верстка", создана пользователем DataPro, 15 ноя 2015.

Информация :
Уважаемые пользователи, прежде чем ответить в теме или создать новую, внимательно ознакомьтесь с Правилами раздела и Правилами форума
Для быстрого поиска ответов на ваши вопросы воспользуйтесь Картой раздела и/или Поиском по разделу
Статус темы:
Закрыта.
Модераторы: ultra
  1. DataPro

    DataPro Natapro

    Регистр.:
    21 авг 2009
    Сообщения:
    181
    Симпатии:
    68
    Здравствуйте, подскажите пожалуйста как заменить анимацию(картинку) при загрузке страницы.
    фон подходит, а анимацию заказчик просит заменить на играющий динамик, нашел гифку, ну как заменить её немогу найти, подскажите пожалуйста, возможно сможете подсказать где находится эта гифка, никак её даже найти не могу
    upload_2015-11-15_18-6-17.png
    http://altsound.net/repair/?lang=en
     
  2. gradar

    gradar Постоялец

    Регистр.:
    15 авг 2015
    Сообщения:
    64
    Симпатии:
    29
  3. joylord

    joylord Степной Волк

    Регистр.:
    27 дек 2012
    Сообщения:
    295
    Симпатии:
    150
    анимация сделана c помощью css
    HTML:
    #load .pace .pace-activity:before,
    #load .pace .pace-activity:after {
        border: none !important;
    }
    HTML:
    #load .pace .pace-activity {
    /*ваша гифка бекграундом*/
    }
     
    Последнее редактирование: 15 ноя 2015
    DataPro нравится это.
  4. DataPro

    DataPro Natapro

    Регистр.:
    21 авг 2009
    Сообщения:
    181
    Симпатии:
    68
    а где найти код подскажите пожалуйста, и как заменить его на гифку.
    или создать анимацию динамика на цсс.
     
  5. gradar

    gradar Постоялец

    Регистр.:
    15 авг 2015
    Сообщения:
    64
    Симпатии:
    29
    Да, действительно в файле main.css прописан loader.gif

    Переименуйте свой файл в loader.gif и положите его в папку images в папку темы, заменив существующий
     
    Последнее редактирование модератором: 16 ноя 2015
  6. joylord

    joylord Степной Волк

    Регистр.:
    27 дек 2012
    Сообщения:
    295
    Симпатии:
    150
    да при чем тут ваш loader.gif - это сделано с помощью css анимации. вы решили посты набить?
    [​IMG]
     
    gradar и DataPro нравится это.
  7. DataPro

    DataPro Natapro

    Регистр.:
    21 авг 2009
    Сообщения:
    181
    Симпатии:
    68
    Заменил и согласен с пользователем Joylord оно заменило анимацию загрузки, вот только загрузки фоток на странице, а не загрузки лоадера.

    Вопрос остаётся открытым, где в каком цсс файле поменять код.
     
  8. joylord

    joylord Степной Волк

    Регистр.:
    27 дек 2012
    Сообщения:
    295
    Симпатии:
    150
    в /css/main.min.css добавьте в конец тот код, который я выслал.
    HTML:
    #load .pace .pace-activity {
    background:url(путь к гифке) 50% 50%;
    }
     
    Последнее редактирование: 15 ноя 2015
    DataPro нравится это.
  9. DataPro

    DataPro Natapro

    Регистр.:
    21 авг 2009
    Сообщения:
    181
    Симпатии:
    68
    к сожелению не получилось
    http://altsound.net/repair/?lang=en
    Добавил код
    Код:
    #load .pace .pace-activity:before,
    #load .pace .pace-activity:after {
    border: none !important;
    }
    #load .pace .pace-activity {
    background:url(../images/load.gif) 50% 50%;
    }
    Загрузил гифку
    http://altsound.net/wp-content/themes/dt-the7/images/load.gif

    Анимация старая пропала, код появился, но картинка не отображается
     
  10. joylord

    joylord Степной Волк

    Регистр.:
    27 дек 2012
    Сообщения:
    295
    Симпатии:
    150
    HTML:
    
    #load .pace .pace-activity {
    background:url(../images/load.gif) 50% 50%;
    margin: -174px 0 0 -175px;
    width: 348px;
    height: 350px;
    }
    размеры выставите согласно картинке
    [​IMG]
    гифка грузится долго, т.к. имеет большой вес. поэтому лоадер успевает к тому времени закрыться.
     
Статус темы:
Закрыта.