Click here to Skip to main content
12,818,785 members (28,497 online)
Click here to Skip to main content
Add your own
alternative version

Tagged as


3 bookmarked
Posted 25 Aug 2011

Create CSS class programmatically

, 26 Aug 2011 CPOL
Rate this:
Please Sign up or sign in to vote.
Create CSS class programmatically

Editorial Note

This article appears in the Third Party Products and Tools section. Articles in this section are for the members only and must not be used to promote or advertise products in any way, shape or form. Please report any spam or advertising.

ExtJS has a utility function to create CSS class programatically, like the following I once used:

Ext.util.CSS.createStyleSheet('.x-tab-tabmenu-right {' +
            'background: transparent url(/images/tab-menu.gif) no-repeat 0 0;' +
            'border-bottom: 1px solid #8db2e3;' +
            'width:18px;' +
            'position:absolute;' +
            'right:0;' +
            'top:0;' +
            'z-index:1000;' +
            'cursor:pointer;' +
            '} .x-tab-tabmenu-over {background-position: -18px 0;}', 'tabMenu'

When I was writing a Sencha Touch Moble web app, I wanted this functionality, but it does not have it. Then I have to use pure JavaScript as follows (I've made it a function):

addClass: function(css) {
    var styleTag = document.getElementsByTagName('style')[0];
    var originalStyles = '';
    if (! styleTag){
        styleTag = document.createElement('style');
        styleTag.type = 'text/css';
    } else {
        originalStyles = styleTag.innerHTML;
    styleTag.innerHTML = originalStyles + css;


This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


About the Author

Software Developer (Senior)
Canada Canada
No Biography provided

You may also be interested in...

Comments and Discussions

-- There are no messages in this forum --
Permalink | Advertise | Privacy | Terms of Use | Mobile
Web01 | 2.8.170308.1 | Last Updated 26 Aug 2011
Article Copyright 2011 by scott_liu
Everything else Copyright © CodeProject, 1999-2017
Layout: fixed | fluid