Форум: Форум PHPФорум ApacheФорум Регулярные ВыраженияФорум MySQLHTML+CSS+JavaScriptФорум FlashРазное
Новые темы: 0000000
Самоучитель PHP 5 / 6 (3 издание). Авторы: Кузнецов М.В., Симдянов И.В. PHP. Практика создания Web-сайтов (второе издание). Авторы: Кузнецов М.В., Симдянов И.В. PHP 5/6. В подлиннике. Авторы: Кузнецов М.В., Симдянов И.В. PHP Puzzles. Авторы: Кузнецов М.В., Симдянов И.В. PHP 5. На примерах. Авторы: Кузнецов М.В., Симдянов И.В., Голышев С.В.
ВСЕ НАШИ КНИГИ
Консультационный центр SoftTime

HTML+CSS+JavaScript

Выбрать другой форум

 

Здравствуйте, Посетитель!

вид форума:
Линейный форум Структурный форум

тема: Подргузка CSS
 
 автор: TanTaL91   (14.09.2010 в 21:34)   письмо автору
 
 

Добрый день. Уважаемые форумчане назрел очередной вопрос:)

Подскажите пожалуйста как с помощью JS выгрузить html+css шаблон? и выгружался он каждую секунду, так что бы если в него были внесены изменения на сервере, изменения сразу же отображались в браузере...

Заранее благодарен!

  Ответить  
 
 автор: sim5   (14.09.2010 в 21:55)   письмо автору
 
   для: TanTaL91   (14.09.2010 в 21:34)
 

Вы каждую секунду меняете CSS?

  Ответить  
 
 автор: TanTaL91   (14.09.2010 в 22:26)   письмо автору
 
   для: sim5   (14.09.2010 в 21:55)
 

Мне не для интернета, я когда верстаю нехочу отвекаться на обновление страницы браузера, проще запустить такую штуку на 2ром мониторе, и глядеть спокойной:)

Почему не простое обновление, сейчас у меня оно и стоит, но от него браузера как нервный дергается, маргает и постояно бросается по скролу то вверх то вниз.

  Ответить  
 
 автор: Gubichev   (15.09.2010 в 01:49)   письмо автору
 
   для: TanTaL91   (14.09.2010 в 22:26)
 

<html>
<head>
<link rel=stylesheet type='text/css' href=''>
</head>
<body onload='setcss()'>
<script language=JavaScript>
var i=0;
function setcss()
{
    var style=document.getElementsByTagName('link')[0];
    style.href='styles.css?'+i;
    i++;
    setTimeout('setcss()',1000);
}
</script>



================Тут ваш код===================


</body>
</html>


Если поставите скрипт себе на страницу, проследите, что-бы LINK с вашим CSS был первый в HEAD.

  Ответить  
 
 автор: AlexSol   (15.09.2010 в 06:43)   письмо автору
 
   для: TanTaL91   (14.09.2010 в 22:26)
 

для firefox есть Reload Every http://reloadevery.mozdev.org/

  Ответить  
 
 автор: sl1p   (15.09.2010 в 07:30)   письмо автору
 
   для: TanTaL91   (14.09.2010 в 21:34)
 

а в опере и качать ничего ненадо) правой кнопкой по странице)

  Ответить  
 
 автор: TanTaL91   (15.09.2010 в 08:03)   письмо автору
 
   для: sl1p   (15.09.2010 в 07:30)
 

Gubichev спасибо, попробу.
AlexSol Не люблю лису:)
sl1p правой кнопкой, и что дальше? "обновить?")))

  Ответить  
 
 автор: AlexSol   (15.09.2010 в 08:15)   письмо автору
 
   для: TanTaL91   (15.09.2010 в 08:03)
 

чуть ниже : обновлять каждые ...

  Ответить  
 
 автор: TanTaL91   (15.09.2010 в 08:30)   письмо автору
 
   для: AlexSol   (15.09.2010 в 08:15)
 

Это все хорошо, но ни чем не отличается от того что я могу вставить JS код в шапку, который будет его так же обновлять...

А вот как у меня сейас реализована подгрузка html:
index.php

<script language='JavaScript'>
function change()
{
if (window.XMLHttpRequest){xmlhttp=new XMLHttpRequest();}
else{xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");}
xmlhttp.onreadystatechange=function(){
    if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
        document.getElementById("body").innerHTML=xmlhttp.responseText;
        }
    }
xmlhttp.open("GET","ajax/refrash-handler-01.php",true);
xmlhttp.send();
}
var timerId=setInterval("change()", 100);
</script>


<div id="body"></div>

ajax/refrash-handler-01.php:

<?
$file_exchange_rate 
file_get_contents("http://localhost/01/index.html");
echo 
$file_exchange_rate;
?>



Когда я вставлю решение уважаемого Gubichev

TanTaL91   (14.09.2010 в 22:26) 
     
    <html> 
<head> 
<link rel=stylesheet type='text/css' href=''> 
</head> 
<body> 
<body onload='setcss()'> 
<script language=JavaScript> 
var i=0; 
function setcss() 

    var style=document.getElementsByTagName('link')[0]; 
    style.href='styles.css?'+i; 
    i++; 
    setTimeout('setcss()',1000); 

</script> 



================Тут ваш код=================== 


</body> 
</html>

Экран сново начинает мерцать... буд то бы идет обновление. А как то иначе можно реализовать подгрузку css. Что бы он так же подгружался незаметно как и html.

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

  Ответить  
 
 автор: sl1p   (15.09.2010 в 08:37)   письмо автору
 
   для: TanTaL91   (15.09.2010 в 08:30)
 

помоему наоборот удобнее каждый раз обновить) так ты морально готов к тому чтобы увидеть изменения) я бы всё равно клацал на обновить даже если бы страница делала это сама)

  Ответить  
 
 автор: TanTaL91   (15.09.2010 в 08:43)   письмо автору
 
   для: sl1p   (15.09.2010 в 08:37)
 

Это вы бы так делали, а я так не хочу делать, на это уходит время... Нужно отвлекаться на ненужную вещь... А так у меня в сосендем мониторе идут изменения, и идут, я только гляжу куда и что подвинуть, как праправить... Работа ускорится как минимум в 1.5 раза...

  Ответить  
 
 автор: АЯ   (15.09.2010 в 14:06)   письмо автору
 
   для: TanTaL91   (15.09.2010 в 08:43)
 

Рецепт:
1. Запомнить текущий body.innerHTML.
2. Запомнить текущий текст styleSheet.
3. Запомнить текущие body.scrollLeft и body.scrollTop.
4. Загрузить в невидимый ифрейм тот же URL c меняющимся query_string.
5. Сравнить body.innerHTML ифрейма с тем, что в памяти; сравнить текст styleSheet ифрейма с тем, что в памяти.
6. При наличии разницы в п. 5 обновить текущее окно с принудительной установкой скролла в предыдущие позиции.
7. Исполнять всё это (п. 1 - п. 6) каждые N секунд.

Примечание: наличие query_string для страницы внутри ифрейма отменяет действие этого скрипта.

  Ответить  
 
 автор: mihdan   (15.09.2010 в 16:12)   письмо автору
 
   для: TanTaL91   (15.09.2010 в 08:43)
 

>Работа ускорится как минимум в 1.5 раза
Поставьте себе среду для разработки (IDE): komodo, PhpStorm - при изменении стилей - увиде сразу обновленный вариант во встроенном браузере.

  Ответить  
 
 автор: Gubichev   (15.09.2010 в 16:54)   письмо автору
 
   для: TanTaL91   (15.09.2010 в 08:30)
 

Переписал код. По идее мерцать не должно.
P.S. У IE теоретически могут возникнуть проблемы с обновлением, т.к. он кеширует CSS. Но такая вероятность крайне мала.
P.P.S. Во время вёрстки лучше воздержаться от мета-тегов, линков и всего остального в HEAD.
<html>
<head>
<link rel=stylesheet type=text/css href='styles.css'>
</head>
<body>
<body onload='setcss()'>
<script language=JavaScript>
var x=0;
function setcss()
{

    x=""+Math.random();
    x=x.substring(2);

    var link=document.createElement('link');
    link.href='styles.css?sdd'+x;
    link.rel='stylesheet';
    link.type='text/css';
    document.getElementsByTagName('head')[0].appendChild(link);
    document.getElementsByTagName('head')[0].removeChild(document.getElementsByTagName('head')[0].childNodes[1]);
    setTimeout('setcss()',1000);
}
</script>

=================ваш код===============


</body>
</html>

  Ответить  
 
 автор: mihdan   (15.09.2010 в 16:10)   письмо автору
 
   для: TanTaL91   (14.09.2010 в 21:34)
 

[поправлено модератором]

  Ответить  
 
 автор: TanTaL91   (15.09.2010 в 17:48)   письмо автору
 
   для: mihdan   (15.09.2010 в 16:10)
 

Всем огромное спасибо за помощь. Особено хотелось выделить Gubichev последнее ваше решение в опере работает на ура, хоть и перезагруается страница, но работе это ни как не мешает...

Отлично, mihdan объязательно посмотрю то что вы посоветовали! Еще раз все спасибо!

  Ответить  
Rambler's Top100
вверх

Rambler's Top100 Яндекс.Метрика Яндекс цитирования