Пилим паршиал . В нем пишем css-свойства будущего прелоад скрина, в том числе и путь до гифки
views/shared/_preloader.slim
Немного кофе %)
assets/javascripts/preloader.coffee
подключаем наш паршиал в
views/layouts/application.slim
И в остальных лэйаутах, если есть.
И добавляем в config/initializers/assets.rb
Все, наш прелоад скрин готов.
Перезагрузка сервера обязательна!
views/shared/_preloader.slim
#loading style='top: 0; height: 100%; width: 100%;position: fixed; background: #1C2126 no-repeat center center ; background-image: url("#{image_path('liquid-bubbles.gif')}"); z-index: 2000000; transition: all 0.3s linear; opacity: 1'on'
Немного кофе %)
assets/javascripts/preloader.coffee
is_old_ie = !window.addEventListenerload_event = if is_old_ie then 'onload' else 'load' bind = (event, callback) -> if is_old_ie if event == load_event window.attachEvent event, callback else document.attachEvent event, callback else if event == load_event window.onload = callback else document.addEventListener event, callback, false bind load_event, -> $_spinner = $('#loading') $_spinner.css('opacity', '0') setTimeout -> $_spinner.css 'display', 'none' , 400
подключаем наш паршиал в
views/layouts/application.slim
И в остальных лэйаутах, если есть.
doctype html html head title SomeTitle = javascript_include_tag 'preloader'
meta name='viewport' content='width=device-width, initial-scale=1' = csrf_meta_tags = favicon_link_tag 'favicon.ico' body = render 'shared/preloader'
И добавляем в config/initializers/assets.rb
Rails.application.config.assets.precompile += %w(
preloader.js )
Все, наш прелоад скрин готов.
Перезагрузка сервера обязательна!
Комментариев нет:
Отправить комментарий