数値をテキストに変更する - jQuery/NivoSlider

Question

以下の例では数値ナビゲーションを実際のテキストリンクに変更しようとしています。

ので'1'は'Football'、'2'は'Ice Hockey'可能性のように...

がどのように私はNivoSliderコードを使用してこれを達成んだろうか？

コードをJSFiddle：http://jsfiddle.net/JSNuU/に移動しました。

私は本当にこれにいくつかの助けに感謝します。

Answer 1

残念ながら、Nivoは一連の画像で置き換える以外に、ナビゲーションを制御するフックを提供していません。 jsFiddle

var navNames = ['one','two','three','four']; 
jQuery('.nivo-control').each(function(i){ 
    $(this).text(navNames[i]) 
}) 

Answer 2

プラグインはこれをサポートしていないようです：あなたがしたい場合は、しかし、事後それらを変更することができます

nivoControl.append('<a class="nivo-control" rel="'+ i +'"><img src="'+ child.attr('rel') + '" alt="" /></a>'); 

：数字がでハードコーディングされています。ただし、プラグインがそれらを作成した後に新しいラベルにハックするjQueryのループを使用することができます。

jQuery('.nivo-controlNav').each(function() { // in case there's more than one 
    var arrLinks = ['one','two','three','four']; 
    jQuery(this).children('a').each(function(i,el) { 
     jQuery(el).text(arrLinks[i]); 
    }); 
}); 

http://jsfiddle.net/mblase75/JSNuU/5/

Answer 3

nivoはこれをサポートしていませんが、その圧縮されていないソースで簡単に見た後、それができました簡単に追加することができます。親指がトグルしているかどうかをチェックした後の行168で、それはこのシンプルなラインを持っています

nivoControl.append('<a class="nivo-control" rel="'+ i +'">'+ (i + 1) +'</a>'); 

これは以下のような適合させることができる。

nivoControl.append('<a class="nivo-control" rel="'+ i +'">'+ kids.eq(i).attr("title") +'</a>'); 

それともaltまたはname、あるいはデータ属性：

nivoControl.append('<a class="nivo-control" rel="'+ i +'">'+ kids.eq(i).data("caption") +'</a>'); 

誰もあなたが本当に1回か2回しか使用していないことに対してこれを修正するために多くの時間を費やしたいとは思わないでしょう。 ;）

ただし、ダウンロードスピードを上げるために事実の後で再圧縮してください。