Categories
Javascript

Auto-Refresh your Browser on file change

    How? Just include Live.js and it will monitor the current page including local CSS and Javascript by sending consecutive HEAD requests to the server. Changes to CSS will be applied dynamically and HTML or Javascript changes will reload the page. Try it!

Where? Live.js works in Firefox, Chrome, Safari, Opera and IE6+ until proven otherwise. Live.js is independent of the development framework or language you use, whether it be Ruby, Handcraft, Python, Django, NET, Java, Php, Drupal, Joomla or what-have-you.

<script type="text/javascript" src="http://livejs.com/live.js"></script>

There is another way to achieve this using jQuery
You could just place a javascript interval on your page, have it query a local script which checks the last date modified of the css file, and refreshes it if it changed.

var modTime = 0;
setInterval(function(){
  $.post("isModified.php", {"file":"main.css", "time":modTime}, function(rst) {
    if (rst.time != modTime) {
      modTime = rst.time;
      // reload style tag
      $("head link[rel='stylesheet']:eq(0)").remove();
      $("head").prepend($(document.createElement("link")).attr({
          "rel":"stylesheet",
          "href":"http://cp.swatantra.info/kb/"
        })
      );
    }
  });
}, 5000);
'Coz sharing is caring

By Swatantra Kumar

Swatantra is an engineering leader with a successful record in building, nurturing, managing, and leading a multi-disciplinary, diverse, and distributed team of engineers and managers developing and delivering solutions. Professionally, he oversees solution design-development-delivery, cloud transition, IT strategies, technical and organizational leadership, TOM, IT governance, digital transformation, Innovation, stakeholder management, management consulting, and technology vision & strategy. When he's not working, he enjoys reading about and working with new technologies, and trying to get his friends to make the move to new web trends. He has written, co-written, and published many articles in international journals, on various domains/topics including Open Source, Networks, Low-Code, Mobile Technologies, and Business Intelligence. He made a proposal for an information management system at the University level during his graduation days.

One reply on “Auto-Refresh your Browser on file change”

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.