Dynamic CSS file loading





34
Date Submitted Mon. Jul. 24th, 2006 10:05 PM
Revision 1 of 1
Helper svachon
Tags CSS | JavaScript
Comments 4 comments
Gives you the ability to dynamically include a CSS file at any time in your HTML page using Javascript.

var CSS = {

        load: /*static*/ function (url_, /*optional*/ media_) {

                // We are preventing loading a file already loaded
                var _links = document.getElementsByTagName("link");
                if (_links.length > 0 && _links["href"] == url_) return;

                // Optional parameters check
                var _media = media_ === undefined || media_ === null ? "all" : media_;
               
                var _elstyle = document.createElement("link");
                _elstyle.setAttribute("rel", "stylesheet");
                _elstyle.setAttribute("type", "text/css");
                _elstyle.setAttribute("media", _media);
                _elstyle.setAttribute("href", url_);

                var _head = document.getElementsByTagName("head")[0];
                _head.element.appendChild(_elstyle);

        }

};
 

Sylvain Vachon

Comments

Comments Updated and Extended
Wed. Feb. 7th, 2007 12:07 AM    Helper brendo
Comments How use it?
Mon. Nov. 27th, 2006 9:24 AM    Newbie brunnolou
  Comments Usage example.
Thu. Jan. 24th, 2008 12:56 PM    Helper Nico

Voting