Question

我想在此代码中隐藏上一个和下一个按钮。我想我可以根据偏移值切换按钮？怎么样？

最后一页继续滚动，它们应该在图像结束时停止。 http://jsfiddle.net/2tUZ4/1/

function slide(container) {
    var $container = $(container);

    var resizeFn = function () {
        var small = $(window).width() < 800;
        $container.toggleClass('four', small).toggleClass('six', !small);
    }

    var toggleButtons = function () {        
    }

    var nextPane = function (e) {
        e && e.preventDefault();
        var $container = $(this).closest('.grid-container');
        var $items = $('.items', $container);
        var offset = $items.css('marginLeft').replace('px', '');
        var width = $container.width() + parseInt($('.item', $container).css('marginRight').replace('px', ''));
        $items.css('marginLeft', offset - width);
    }

    var prevPane = function (e) {
        e && e.preventDefault();
        var $container = $(this).closest('.grid-container');
        var $items = $('.items', $container);
        var offset = $items.css('marginLeft').replace('px', '');
        var width = $container.width() + parseInt($('.item', $container).css('marginRight').replace('px', '')); 
        $items.css('marginLeft', offset + width);
    }

    resizeFn();
    $(window).resize(resizeFn);

    $('.next', $container).click(nextPane);
    $('.prev', $container).click(prevPane);

}


slide('.grid-container.one');
slide('.grid-container.two');
slide('.grid-container.three');

Answer 1

您需要比较宽度，例如FIDDLE

var nextPane = function (e) {
        e && e.preventDefault();
        var $container = $(this).closest('.grid-container');
        var $items = $('.items', $container);
        var offset = $items.css('marginLeft').replace('px', '');
        var width = $container.width() + parseInt($('.item', $container).css('marginRight').replace('px', ''));
        $items.css('marginLeft', offset - width);

        if( $(this).parent().find('.items').width() + (offset - width) < width){
        $(this).hide();
        }
    }

Jquery滑块在第一个或最后一个时隐藏prev和next

1 个答案: