jquery icon on sorting column/header
jquery icon on sorting column/header
Hi,
I have applied a jquery theme to the table and noticed that the icon appears above the column name in the table header instead of next to it making the header quite tall.
Is there a way that I can move the icon to the left instead of on top. I looked in the css and the class it is referring to is 'css_right ui-icon ui-icon-carat-2-n-s' and it is defined as [code]'.ui-icon-carat-2-n-s { background-position: -128px 0; }'[/code] but I can't work out how that is positioned. I played with it but I can't get it to move to the left of the column name like in the examples
Is see in the js code where sSortJUI is making reference to it...should I be trying to alter this or is there a less 'risky' alternative...?
[code]
var jqSpan = $("span", oSettings.aoColumns[i].nTh);
jqSpan.removeClass(oClasses.sSortJUIAsc +" "+ oClasses.sSortJUIDesc +" "+
oClasses.sSortJUI +" "+ oClasses.sSortJUIAscAllowed +" "+ oClasses.sSortJUIDescAllowed );
[/code]
thanks for any help
I have applied a jquery theme to the table and noticed that the icon appears above the column name in the table header instead of next to it making the header quite tall.
Is there a way that I can move the icon to the left instead of on top. I looked in the css and the class it is referring to is 'css_right ui-icon ui-icon-carat-2-n-s' and it is defined as [code]'.ui-icon-carat-2-n-s { background-position: -128px 0; }'[/code] but I can't work out how that is positioned. I played with it but I can't get it to move to the left of the column name like in the examples
Is see in the js code where sSortJUI is making reference to it...should I be trying to alter this or is there a less 'risky' alternative...?
[code]
var jqSpan = $("span", oSettings.aoColumns[i].nTh);
jqSpan.removeClass(oClasses.sSortJUIAsc +" "+ oClasses.sSortJUIDesc +" "+
oClasses.sSortJUI +" "+ oClasses.sSortJUIAscAllowed +" "+ oClasses.sSortJUIDescAllowed );
[/code]
thanks for any help
This discussion has been closed.
Replies
If I am correct are you trying to move the sorting icons to the left of the header text? by default I believe this is set to the right. However when I first used this my icons were above too. I had to add the css_right class to my own style sheet. If you want the icons on the left try putting this in with the float attribute set to left e.g.
[code]
.css_right {float: left;}
[/code]
Hope this helps.
Regards,
Izzy