Adding CSS to a page through Javascript

There is no sensible reason to use this but it comes in handy as a hack for CMS systems – when there is no other choice!.

var head = document.getElementsByTagName('head')[0],
                style = document.createElement('style'),
                rules = document.createTextNode('.coming-soon-state-selection{margin:25px 0;}.coming-soon-table{width:593px;}.coming-soon-table .title{overflow:hidden;}.coming-soon-table .title h3{float:left;font-size:1.375rem;}.coming-soon-table .title p{float:right;line-height:2rem;padding-left:22px;}.coming-soon-table .coming-soon-state{border-bottom:1px solid #dbdbdb;}.coming-soon-table .coming-soon-state .category .category-title{min-height:40px;border-top:1px solid #dbdbdb;border-bottom:1px dotted #ababab;overflow:hidden;}');

    style.type = 'text/css';
    if (style.styleSheet) {
        style.styleSheet.cssText = rules.nodeValue;
    } else {
        style.appendChild(rules);
    }
    head.appendChild(style);
Advertisements
  1. No trackbacks yet.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: