jQuery Splitter /拆分器位置(如果窗口调整大小)

时间:2019-06-27 21:11:13

标签: javascript jquery masonry splitter

你好我使用jQuery Splitter和Masonry。 这是我的代码:

$(window).on('load', function(){
$('.grid').masonry({
isAnimated: true,
itemSelector: '.grid-item',
percentPosition: true,
horizontalOrder: false
});
})

var splitter = $('#content').split({
orientation: 'vertical',
position: '50%',
limit: 400,
onDrag: function(event) {
Splitter();
$('.grid').masonry({
itemSelector: '.grid-item',
percentPosition: true,
horizontalOrder: false
});
}
});

Splitter();
function Splitter(){
if ($('#right').width() < 600) {
$('.grid-item').css("width", "100%")
}
else if ($('#right').width() < 800) {
$('.grid-item').css("width", "50%")
}
else {
$('.grid-item').css("width", "33.3333%")
}
}

$( window ).resize(function() {
$('#main').css('min-height', '100%');
Splitter();
splitter.position('50%')
});

我遇到的问题是,当我调整窗口大小的大小时,在某些情况下(例如,当我将分离器移到右侧时),网格项目变得很小。 »$(window).resize(function()«中的»splitter.position('50%')«在某种程度上解决了该问题。

但是:如果我将拆分器拖动到右侧(到400px限制点)并调整大小,则窗口尺寸应尽可能小,网格项仍然会变得非常小。 »limit:400«命令优先于»splitter.position('50%')«。

我想要的是:如果调整窗口大小,则拆分器位置应始终保持50%。

怎么可能呢?

非常感谢。 <3

0 个答案:

没有答案