Accessible News Sliderついて

質問

Accessible News Sliderの( view all )と( view less )を画像に変えたいのですがどうすれば良いでしょうか？
よろしくお願いします。

■サンプルページURL
http://www.32byte.com/downloads/kayanhaber/index.html

回答No.1

my-- · ベストアンサー

// jquery.accessible-news-slider.js 78行目
$next.css( "display", "block" )
// テキスト"view all"をimg要素(all.gif)に変更
.parent().after( [ "<p class=\"view_all\">", settings.headline, " - ", li.length, " total <a href=\"#\"><img class=\"all-img\" src=\"all.gif\" alt=\"view all\"></a></p>" ].join( "" ) );
jQuery( ".view_all > a, .skip_to_news > a", $this ).click(function() {
　var skip_to_news = ( jQuery( this ).html() == "Skip to News" );
　var img = jQuery('img', this ); // img要素（追加）
　if ( img.hasClass('all-img') || skip_to_news ) { // クラス名"all-img"を持っているかで分岐（変更）
　　ul.css( "width", "auto" ).css( "left", "0" );
　　$next.css( "display", "none" );
　　$back.css( "display", "none" );
　　if ( !skip_to_news ) {
　　　// 各属性の書き換え（変更）
　　　img.attr( {'src': 'less.gif', 'alt': 'view less', 'class': 'less-img'} );
　　}
　} else {
　　if ( !skip_to_news ) {
　　　// 各属性の書き換え（変更）
　　　img.attr( {'src': 'all.gif', 'alt': 'view all', 'class': 'all-img'} );
　　}
　　ul.css( "width", ( li.length * liWidth ) );
　　$next.css( "display", "block" );
　}
　return false;
});

jquery.accessible-news-slider.jsに手を加えないと無理みたい。
src、alt、class各属性値は適当に書き換えて下さい。

オリジナルと比較してみて、なんとなくでも何をやってるのか把握できれば
自分で手を加えられるようになるかも知れないです。

お礼

分岐の部分が、わかっていませんでした。
勉強になります。
これからいろいろ試してみます。
ありがとうございました。