Skip to content

Instantly share code, notes, and snippets.

@comxd
Created February 7, 2017 20:23
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save comxd/a76ef6c3da557eb8d17f0218f8df50cc to your computer and use it in GitHub Desktop.
Save comxd/a76ef6c3da557eb8d17f0218f8df50cc to your computer and use it in GitHub Desktop.
Right aligned tabs for TabContainer (Dojo Toolkit)
/**
* TabContainer with tabs aligned to the right
* @require dijit/layout/TabContainer
* @author ComExpertise SARL <https://www.comexpertise.com>
* @tutorial http://stackoverflow.com/questions/9433707/is-it-possible-to-align-dijit-layout-tabcontainer-tabs-to-the-right
* @version 1.0.0
*/
define([
"dijit/layout/TabContainer",
"dojo/_base/declare",
"dojo/_base/lang",
"dojo/dom-geometry",
"dojo/dom-style",
"dojo/query"
],
function (TabContainer, declare, lang, domGeom, domStyle, query) {
return declare("TabContainerTabsRight", [TabContainer], {
/**
* @override
* @param args
*/
constructor: function (args) {
lang.mixin(this, args);
this.inherited(arguments);
},
/**
* @override
*/
startup: function () {
this.inherited(arguments);
this.alignTabsToRight();
},
/**
* @override
* @param resize
*/
resize: function (resize) {
this.alignTabsToRight();
this.inherited(arguments);
},
alignTabsToRight: function () {
var tabListNode = this.tablist.domNode;
var tabStripNode = (this.nested ? query(tabListNode).parent('.dijitTabContainerNested') : query("div.nowrapTabStrip", tabListNode))[0];
var tabListPosition = domGeom.position(tabListNode);
var tabStripPosition = domGeom.position(tabStripNode);
var tabStripLeft = (-tabStripPosition.w + tabListPosition.w) + "px";
domStyle.set(tabStripNode, "textAlign", "right");
domStyle.set(tabStripNode, "left", tabStripLeft);
}
});
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment