twitter-bootstrap – 带流畅布局的Bootstrap Affix插件

发布时间：2020-12-18 00:15:27 所属栏目：安全来源：网络整理

导读：如果我想在流畅的布局中使用侧边栏的粘贴插件，但是边框的宽度在贴上时总是会改变，并且响应式设计也不起作用。在Bootstrap文档中，粘贴插件不与流体布局一起使用。也许是因为他们有同样的问题。有人知道如何使它工作吗？解决方法要使用流畅的span3边栏

如果我想在流畅的布局中使用侧边栏的粘贴插件，但是边框的宽度在贴上时总是会改变，并且响应式设计也不起作用。

在Bootstrap文档中，粘贴插件不与流体布局一起使用。
也许是因为他们有同样的问题。

有人知道如何使它工作吗？

解决方法

要使用流畅的span3边栏工具，您需要添加一些javascript来钳制宽度并管理调整大小。

我只是写了一个小的javascript函数来使这项工作。

从引导出发查看this bug。

/*
* Clamped-width. 
* Usage:
*  <div data-clampedwidth=".myParent">This long content will force clamped width</div>
*
* Author: LV
*/
$('[data-clampedwidth]').each(function () {
    var elem = $(this);
    var parentPanel = elem.data('clampedwidth');
    var resizeFn = function () {
        var sideBarNavWidth = $(parentPanel).width() - parseInt(elem.css('paddingLeft')) - parseInt(elem.css('paddingRight')) - parseInt(elem.css('marginLeft')) - parseInt(elem.css('marginRight')) - parseInt(elem.css('borderLeftWidth')) - parseInt(elem.css('borderRightWidth'));
        elem.css('width',sideBarNavWidth);
    };

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

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!