Customize the Title Bar Navigation (Pro)

Customize the Title Bar Navigation

You can make some customization to the title bar of the accordion slider. You can hide the current title, rotates clock wise, and sets different size for the current title.

Rotates Clock Wise

To rotate the title bar clock wise, simply set the titleClockWiseRotation option to true, like so:

var myEvoSlider = $("#mySlider").evoSlider({
    mode: "accordion",
    titleClockWiseRotation: true
});
                

Hides Current Title

To hide the current title, simply set the hideCurrentTitle option to true, like so:

var myEvoSlider = $("#mySlider").evoSlider({
    mode: "accordion",
    hideCurrentTitle: true
});
                

Sets Different Size for the Current Title

To give different size for the current title, you have to edit the CSS file. Open the CSS skin file, and then in the SLIDER section find the 'slider title bar' label. In the active style of the title bar, set the height property value, for example:

/* The active state of the title bar */
.evoslider.default dt.active
{
	height: 60px;
	color: #4e4e4e;
	background: #4e4e4e url('title_bar.png') no-repeat;
	cursor :default;
}