1

私はこれに苦労しており、ドキュメントで解決策を見つけることができませんでした。AnythingSlider は必要に応じてサムネイルを作成していますが、動かないだけです。それらは修正されたようで、9 つのサムネイルしか表示されません。問題は、9 つ​​以上の写真を追加すると、サムネイルが現在の行に追加されて非表示になるのではなく、次の行にスタックされることです。

これは私が使用しているコードです:

$('#slider1')
              .anythingSlider({
               navigationFormatter : function(i, panel){ // add thumbnails as navigation links
                return '<img src="images/thumbs' + ['01', '02', '03', '04', '05', '06', '07', '08', '09', '10', '11', '12', '13', '14', '15', '16', '17', '18', '19',][i - 1] + '.jpg">';
               },
                // Callback when the plugin finished initializing
                onInitialized: function(e, slider) {

                    var time = 1000, // allow movement if < 1000 ms (1 sec)
                        range = 50,  // swipe movement of 50 pixels triggers the slider
                        x = 0, t = 0, touch = "ontouchend" in document,
                        st = (touch) ? 'touchstart' : 'mousedown',
                        mv = (touch) ? 'touchmove' : 'mousemove',
                        en = (touch) ? 'touchend' : 'mouseup';

                    slider.$window.add( slider.$controls )
                        .bind(st, function(e){
                            // prevent image drag (Firefox)
                            e.preventDefault();
                            t = (new Date()).getTime();
                            x = e.originalEvent.touches ? e.originalEvent.touches[0].pageX : e.pageX; 
                        })
                        .bind(en, function(e){
                            t = 0; x = 0;
                        })
                        .bind(mv, function(e){
                            e.preventDefault();
                            var newx = e.originalEvent.touches ? e.originalEvent.touches[0].pageX : e.pageX,
                            r = (x === 0) ? 0 : Math.abs(newx - x),
                            // allow if movement < 1 sec
                            ct = (new Date()).getTime();
                            if (t !== 0 && ct - t < time && r > range) {
                                if (newx < x) { 
                                    if ($(this).hasClass('anythingControls')) {
                                        slider.$controls.find('.next').trigger('click');
                                    } else {
                                        slider.goForward();
                                    }
                                    return false;
                                }
                                if (newx > x) {
                                    if ($(this).hasClass('anythingControls')) {
                                        slider.$controls.find('.prev').trigger('click');
                                    } else {
                                        slider.goBack(); 
                                    }
                                }
                                t = 0; x = 0;
                                return false;
                            }
                        });
                }
               });});});

この構成で何が間違っている可能性がありますか? 前もって感謝します！

4

1 に答える 1

1

navigationSizeオプション設定が抜けているようです。デフォルトではfalse、表示されるコントロールの数は制限されていません。

これがあなたがエミュレートしようとしているデモだと思います。

于 2012-09-05T19:44:25.810 に答える