草庐IT

bootstrap-grid

全部标签

javascript - 使 Bootstrap 响应基于父 div 的最佳方法?

我需要Bootstrap中的容器基于父div而不是媒体查询进行响应。如果可能的话,我无法找出最好的方法,尤其是在不使用javascript的情况下。目前,在调整大小时,我会计算.span*div是否应为100%宽度(如果父div最终低于640px)或遵守列CSS。这是一个jsfiddle。使用.somecontainer上的CSS,.span*的内部布局应该像移动一样-因此如果将CSS更改为640px以上,则每一列都应该全宽,例如,它将重新布局为列布局。有什么想法吗?目前正在使用类似这样的代码(这并不理想)$(document).ready(function(){$('.somecon

javascript - 在 bootstrap-datepicker 上突出显示某些日期

我正在使用bootstrap-datepicker来检查我的网站获得销售的日期,我想显示或突出显示至少有一次销售的日期。我可以在JSON上传递日期,然后将它们放入Javascript的数组中,但我不知道如何让日期选择器获取日期并突出显示它们。有没有办法使用bootstrap-datepicker来实现这一点? 最佳答案 这是另一个突出显示日期范围的示例:varinRange=false;$('#elementPicker').datepicker({beforeShowDay:function(date){dateFormat=da

javascript - 如何在 AngularJS ui-grid 中自动调整列宽

在AngularJS中ui-grid,如何配置网格,使其在渲染时根据内容自动调整列宽?我知道有一个tutorial显示自动调整大小功能,但仅当您双击该列时才有效,我希望它可以在启动网格时发生。 最佳答案 在列定义中使用星号:width:"*"; 关于javascript-如何在AngularJSui-grid中自动调整列宽,我们在StackOverflow上找到一个类似的问题: https://stackoverflow.com/questions/30383

javascript - bootstrap.js 中的 emulateTransitionEnd,它来自哪里?

我正在调试modal.js并遇到了以下代码:that.$element.find('.modal-dialog')//waitformodaltoslidein.one('bsTransitionEnd',function(){that.$element.trigger('focus').trigger(e)}).emulateTransitionEnd(Modal.TRANSITION_DURATION):that.$element.trigger('focus').trigger(e)我的问题是关于以下行:emulateTransitionEnd(Modal.TRANSITION_

javascript - 如何从 javascript 函数中显示 Bootstrap 模式?

我的页面上有一个按钮,当它被按下时会触发一些javascript函数,其中一个javascript函数会打开Bootstrap模式,但我似乎无法让它工作。这是我的代码...请帮助。//elsewhereontheformisthebuttonthattriggersthejavascriptYes,cancelitxCancelPurchaseOrder?Yes,cancelitNevermind$('.btn-danger').click(function(event){if(somerandomconditionalstatement){//somestuffhappenshere

javascript - UI-Grid 在页面加载时不会占用 100% 的宽度

我正在使用ui-grid在表格中显示数据。当我加载页面并离开几秒钟然后单击选项卡(包含ui-grid)时,ui-gridcss中断。它不显示ui-grid100%容器的宽度。但是当我加载页面并单击选项卡(包含ui-grid)时。ui-grid显示完美,我的意思是它的宽度是容器的100%。我不知道是什么问题。这是代码,我正在处理:Js:$scope.gridOptions={enableFiltering:true,enableGridMenu:true,enableRowSelection:true,enableSelectAll:true,selectionRowHeaderWidt

javascript - Bootstrap 4 可折叠卡片 - 断断续续的动画

我正在使用Bootstrap4并创建了一张带有.card-header和.card-block的卡片,如下所示:cardheadercardblock我希望能够单击卡片标题来切换卡片block。我试过使用Bootstrap的折叠机制(您会注意到卡片标题中的data-toggle="collapse")。它有效-但动画非常不稳定。我不知道为什么。Here'sanexampleoncodepen. 最佳答案 延迟问题:问题是.card-block类,它默认添加了1.25rem的填充。如果您从div#test-block中删除类card-

javascript - 加载时的 Bootstrap-angular-ui 模式

我正在使用bootstrap-angular-ui-modal对于我正在处理的网站。我用来打开模态的代码$modal.open({templateUrl:'/home/template',controller:myCtrl,resolve:{data:function(){returndata;}}});一切正常。但是我需要找到一种方法来在加载模态后执行一些代码。我尝试了不同的东西,但无法使它们起作用。我尝试过的一些事情在我做的模板中document.onload=function(){console.log('opened');};我还发现名为openned的Angular模态对象有

javascript - 将 bootstrap popover 保持在视口(viewport)内

我正在尝试使用带有按钮的侧边栏创建一个菜单,每个按钮都有一个包含相关数据的指定弹出窗口。不幸的是,其中一个弹出窗口可能包含任意数量的行,并且在某些情况下它可能部分位于视口(viewport)之外。参见http://jsfiddle.net/bfd9f/1/有关问题的示例(单击“任务”按钮)我想我可以通过编程将弹出窗口的顶部更改为一个定义的值,当负值(即在视口(viewport)之外)时,为了做到这一点,我已经设法在收听show.bs.popover事件。不幸的是,我认为由于它尚未呈现,它的大小似乎为(23,107),而它应该类似于(300,xxx)并且位置为(0,0)。有没有办法解决这

javascript - 如何在ajax成功中打开bootstrap modal

我想通过jquery打开bootstrap模式。我知道ajax在运行成功时会发出警报。但是无法打开模态。这些是我的代码。$.ajax({type:"POST",url:"",data:{'apiName':apiName,'api':api,'hotel':hotel,'payment':payment,'template':template},success:function(msg){$("#getCodeModal").modal("toggle");$("#getCode").html(msg);}});我的模态HTML是:×APICODE//ajaxsuccess