Forcibly reloads CSS files if it appears that they didn't load correctly, when given a specific HTML element and a bad (and/or good) css rule to check against.

qut-bbcssfix.js

/**
 * qut-bbcssfix
 * @author Christopher Baldwin [https://staff.qut.edu.au/details?id=baldwicc]
 * @licence Simplified BSD License
 * @source https://gist.github.com/baldwicc/6410608
 */

/* Usage:
 -  Set elem_to_check and style_to_check to a style that doesn't appear to load correctly
 -  Set bad_value to the default css rule applied to this element (eg: "none")
 -  Set the url's to the stylesheets to forcibly load.  
    [Note that Blackboard often includes others like announcements.css, that will not be covered by this hack.]
 
 Optional:  
 -  Set good_value to the "good" css value, if a bad one is not appropraite
 -  Set use_ga to use google analytics
 */

Event.observe(document, "dom:loaded", function() {

  /* OPTIONS */
  var opts = {

    /* define the element and style to check */
    elem_to_check: $$('.hideoff')[0],

    style_to_check: 'left',

    /* value when css fails to load */
    bad_value: null,

    /* value when css loads successfully */
    good_value: "-10000px",

    /* an array of stylesheets to forcibly load */
    sheets_to_reload: [
      "/branding/themes/qut_theme/theme1.css",
      "/branding/themes/qut_theme/theme2.css"
    ],

    /* whether or not to track an event to google analytics */
    use_ga: true
  };

  // get current rule
  var cssrule = $(opts.elem_to_check).getStyle(opts.style_to_check);

  // check against bad_value (and good_value if it's defined)
  if (cssrule === opts.bad_value || (opts.good_value && (cssrule !== opts.good_value))) {

    // recreate stylesheets in the array
    for (var i = 0; i < opts.sheets_to_reload.length; i++) {
      document.head.appendChild(new Element('link', {
        'rel': 'stylesheet',
        'type': 'text/css',
        'href': opts.sheets_to_reload[i] + "?" + new Date().getTime()
      }));
    }

    // track to google analytics
    if (opts.use_ga) {
      var _gaq = window._gaq || [];
      _gaq.push(["_trackEvent", "css", "css", "css"]);
    }
  }

});