Two digit format for Anything Slider Navagation IE 01 02 03 04 05

[resonant]

I am currently using anythingslider for a site i am building.

http://www.crooksncastles.com/testing123 (currently building excuse the mess)

I am trying to figure out how to change the navigation number format to a two digit format. (IE 01 02 03 … 10) I know in PHP you would say ( any number under 10 add a Zero before) I’m not to good with jquery… please help
thank you!

[resonant]

Hi Mottie!
first! thank you for taking the time to look at this for me.

I think I should have mentioned that i am using the wordpress plugin.
I have entered the code in to the js/jquery.anythingslider.js and nothing is happening. maybe, I’m not placing it in the right place?

[resonant]

so it’s almost working… lol see here here is his code for the navigation ( with your code at the beginning)

$.anythingSlider.defaults = {

// a bunch of default options left out

navigationFormatter: function(i){ return ( i <= 9 ) ? '0' + i : i; },

// the rest of the default options

};



// Creates the numbered navigation links

base.buildNavigation = function() {

var tmp, klass, $a;

if (base.options.buildNavigation && (base.pages > 1)) {

base.$items.filter(':not(.cloned)').each(function(i,el) {

var index = i + 1;

klass = ((index === 1) ? 'first' : '') + ((index === base.pages) ? 'last' : '');

$a = $('').addClass('panel' + index).wrap('
');

base.$nav.append($a.parent()); // use $a.parent() so IE will add 
 instead of only the  to the 








// If a formatter function is present, use it

if ($.isFunction(base.options.navigationFormatter)) {

tmp = base.options.navigationFormatter(index, $(this));

$a.html('' + tmp + '');

// Add formatting to title attribute if text is hidden

if (parseInt($a.find('span').css('text-indent'),10) < 0) { $a.addClass(base.options.tooltipClass).attr('title', tmp); }

} else {

$a.html('' + index + '');

}



$a.bind(base.options.clickControls, function(e) {

if (!base.flag && base.options.enableNavigation) {

// prevent running functions twice (once for click, second time for focusin)

base.flag = true; setTimeout(function(){ base.flag = false; }, 100);

base.gotoPage(index);

if (base.options.hashTags) { base.setHash(index); }

}

e.preventDefault();

});

});

}

};

so what do you think?

[jamygolden]

You could do it with CSS.

.thumbNav li a:before{content: '0';}

.thumbNav li:nth-child(9n) ~ li a:before{content: '';}

The cross browser support isn’t brilliant, but you could add something like this to your page which would bridge that gap. http://selectivizr.com/

[resonant]

@Mottie This works! I also wrote the plugin developer (I thought it was you, that is why I wrote on here first) and he gave me something similar but he put it in the shortcode.php (he made the plugin use shortcode) thank you soo much!!!

@jamy_za I thought about this option at first, then when I tested it on IE7, no bueno ( DEATH TO IE!!!!!) I wish they would step up their game or just stop…

[Author]

Posts