Namespace | WVUS.UiKit

The UiKit uses a namespace to stop CSS and JavaScript collisions.

Less

The namespace used for the less is wvusUikit. Apply this class to the <html> element in your site.

<!DOCTYPE html>
<html class="wvusUikit">
...

If adding UiKit elements on parts of a site, prepend with wvusUikit.

<div class="wvusUikit panel panel-default">

jQuery

The UiKit uses the popular jQuery library. Normally, jQuery uses the $ alias and the jQuery object. This has been removed in the UiKit to stop 3rd party jQuery code from conflicting the UiKit components and widgets. At the beginning of the wvus.uikit.js, jQuery.noConflict(true) called to assign the jQuery object to the wvusUikit object.

To use the UiKit jQuery plugins, substitute the $ or jQuery objects with wvusUikit.

// Standard jQuery syntax
$('a').click(function(){
  // do stuff
});

// UiKit syntax
wvusUikit('a').click(function(){
  // do stuff
};

For writing longer JavaScript files using the UiKit plugins, use an Immediately Invoked Function Expression. This expression is commonly used when creating plugins and will allow the use of an alias for easier development.

// $ is the alias
(function($){
$(document).ready(function(){
  $('a').click(function(){
    // do stuff
  });
});

// wvusUikit is the namespace
})(wvusUikit);