0 Пользователей и 1 Гость просматривают эту тему.
  • 4 Ответов
  • 14128 Просмотров
*

PaLyCH

  • Давно я тут
  • 956
  • 146 / 19
  • Менеджер проектов
Часто так бывает, что внося изменения в стили CSS верстальщик постоянно обновляет страницу. Порою это сильно раздражает, особенно когда внесли изменения в HTML с помощью FireBug-а или инструментов разработчика в других браузерах. В итоге с могучим JS программистом Игорем Демньяновым написали скрипт, который перезагружает с сервера файлы стилей, так называемый ReloadCSS.

Чтобы включить такой функционал у вас на сайте, требуется сделать 4 простых шага.

1. Кладем скрипт в любую папку. У меня лежит в папке шаблона lisp
/templates/lisp/js/dev.js

2. Подключить JS следующим кодом в файле index.php шаблона
Код: html4strict
<script type="text/javascript" src="/templates/lisp/js/dev.js"></script>


3. В HTML код вставляем ссылку, в любое место index.php шаблона . Лучше в начала или в конец
Код: html4strict
<a href="#" onclick="DeveloperTool.Init().ReloadAllCSSThisPage()" class="dev-css">Обновить CSS</a>

4. Описываем стили. У меня лично такие, а там уже кто как хочет оформляет кнопку Reload CSS по своему:

Код: css
.dev-css { 
    position:fixed;
    left:1em;
    top:1em;
    display:block;
    float:left;
    padding:1em;
    border-radius:7px;
    background-color: rgba(0, 0, 0, 0.6);
    color:#FFF}

Скачать файл dev.js
Статья оригинал  - Обновление стилей CSS без перезагрузки страницы - Reload CSS
« Последнее редактирование: 16.08.2016, 10:29:40 от PaLyCH »
*

SmokerMan

  • Гуру
  • 5293
  • 720 / 26
Чего-то я смысл этой затеи не пойму. Типа лучше кликнуть на кнопку чем нажать Ctrl+R :)
Цитировать
Порою это сильно раздражает, особенно когда внесли изменения в HTML с помощью FireBug-а или инструментов разработчика в других браузерах
Этот скрипт просто обновляет файлы CSS и причем здесь FireBug? При внесении изменений в нем файлы то остаются вроде как не тронутыми.
*

PaLyCH

  • Давно я тут
  • 956
  • 146 / 19
  • Менеджер проектов
Чего-то я смысл этой затеи не пойму. Типа лучше кликнуть на кнопку чем нажать Ctrl+R :)Этот скрипт просто обновляет файлы CSS и причем здесь FireBug? При внесении изменений в нем файлы то остаются вроде как не тронутыми.
Одно дело перезагрузить файлик весом в 5 кб, а не весь сайт весом в 600-700 Килобайт, очень удобно. Изменения видишь быстрее. Я просто кайфую от удобства и быстродействия
*

Professor

  • Захожу иногда
  • 59
  • 10 / 0
Клёво, буду использовать. Спасибо. Оно конечно не необходимо, но может немного упросить жизнь)
*

DimNsk

  • Осваиваюсь на форуме
  • 48
  • 3 / 0
зачем так сложно

ярлык на панель со следующим кодом

Код
javascript:void(function(){var%20i,a,s;a=document.getElementsByTagName('link');for(i=0;i<a.length;i++){s=a[i];if(s.rel.toLowerCase().indexOf('stylesheet')>=0&&s.href)%20{var%20h=s.href.replace(/(&|%5C?)forceReload=\d+/,'');s.href=h+(h.indexOf('?')>=0?'&':'?')+'forceReload='+(new%20Date().valueOf())}}})();
Чтобы оставить сообщение,
Вам необходимо Войти или Зарегистрироваться