如何在引导程序中为不同大小定义“粘贴”显示？

Question

我在某些侧边栏上贴上了这样的文字：

<div class="col-xs-6 col-sm-3  sidebar-offcanvas" id="sidebar" data-spy="affix">

我想告诉他：

当您到达定义的尺寸时：

col-xs-6 col-sm-3

我需要您禁用“数据间谍”元素。 当到达正确尺寸时，将其放回原处。

Answer 1

Bootstrap col-sm和col-xs效果小于或等于768px。您可以使用jQuery动态应用它。

这是代码。

function setDataSpy() {
  var windowWidth = $(window).width();
  var sidebar = $('#sidebar');
  var dataSpy = sidebar.attr('data-spy');

  if (windowWidth <= 768 && dataSpy != undefined) {
    sidebar.attr('data-spy', 'affix');
  } else {
    sidebar.attr('data-spy', '');
  }
}
setDataSpy();
$(window).resize(function() {
  setDataSpy();
});

当屏幕尺寸小于768px时， data-spy="affix"添加data-spy="affix" ..根据需要更改数字。