Tag: twitter bootstrap

input-group-addon with bootstrap-select

我尝试使用带有bootstrap-select的 Label 2 ,但它看起来与bootstrap ( Label 1 )不同。 如何让下面代码中的两个标签看起来一样? Test Labe 1 GO! Label 2 Hot Dog, Fries and a Soda Burger, Shake and a Smile Sugar, Spice and all things nice Baby Back Ribs A really really long option made to illustrate an issue with the live search in an inline form $(‘.selectpicker’).selectpicker();

具有引导程序/ Jquery的多级(最多3级)垂直菜单

我正在尝试创建一个垂直且最多3级导航的导航菜单,最后一级是可切换的菜单(当你点击最后一级菜单时,下面会出现一组子菜单)。菜单结构的示例结构是与此类似 我试过下面的代码,但没有获得所需的输出 Bootstrap <!– Optional theme –> .dropdown-submenu { position: relative; border-bottom: 1px solid #ccc; } .dropdown-submenu > .dropdown-menu { top: 0; left: 100%; margin-top: -6px; margin-left: -1px; -webkit-border-radius: 0 6px 6px 6px; -moz-border-radius: 0 6px 6px; border-radius: 0 6px 6px 6px; } .dropdown-submenu:hover > .dropdown-menu { display: block; } .dropdown-submenu > a:after { display: […]

Bootstrap折叠。 如何一次只扩展一个div

我怎样才能一次展示一个? 演示: http : //jsfiddle.net/tvvq59wv/ $(‘.collapser’).click(function() { $(this).next().collapse(‘toggle’); }); asfa asf asfasf afsf afsasf asf asf asf adf test asf afsas afsasf asf asf t1 asfa afsasf test sd sdgs sd asf asfas afasf asfasfgd asf afsas afsasf asf asf t1 提前致谢!

在bootstrap模式中加载iframe

我想在ifst加载之前将iframe加载到bootstrap模式中并显示加载器。 我正在使用一个简单的jquery点击function,但它无法正常工作。 我不明白为什么它不起作用。 小提琴整页小提琴 $(‘.btn’).click(function() { $(‘.modal’).on(‘show’,function() { $(this).find(‘iframe’).attr(‘src’,’http://www.google.com’) }) $(‘.modal’).modal({show:true}) $(‘iframe’).load(function() { $(‘.loading’).hide(); }); })

转换附加导航栏 – CSS

我有一个固定的导航栏使用Twitter Bootstrap 3的affix() 。 使用导航栏一切正常。 我想在导航栏的外观中添加一个transition 。 当用户滚动页面时,导航栏立即显示。 我想给它制作动画。 尝试使用-webkit-transition: all 1s ease-in但结果是导航栏的宽度。 这是FIDDLE 。 当用户向下滚动时,请帮助我设置动画。

jquery ajax / django – 在bootstrap模式中显示当前表单并重新显示validation是否成功

我的用例是: a)在bootstrap模态中呈现通过ajax加载的表单, 花式叠加效果… 我遵循了这些指示 。 这很好用。 (见下面的代码) b)将此表单提交回我的Django应用程序,尝试validation它,如果它没有validation,重新显示带有奇特引导模式中的错误的表单。 我可以通过ajax重新加载表单,但我无法在模态中再次表示它。 注意:我没有包含视图,因为它没有什么特别之处。 仅实例化和validation表单。 下面有很多东西要读,所以如果您认为用例听起来很有趣,请继续… 我的taskList.html看起来像这样: Name Edit Task 1 edit .js用于加载表单+显示bootstrap模态+绑定表单到.jquery提交调用: $(document).ready(function() { modalConnect(); }); //connects the modal load for each with class editItem //Functionality 1 //loads an item edit form from the server and replaces the itemFormModal with the form //presents the modal with $(“#itemFormModal”).modal(‘show’); //Functionality […]

Bootstrap 3 – 使用固定侧边栏时,模态在背景下消失

我已经识别出这个问题正在发生,因为弹出窗口被封闭在另一个具有position:fixed div中position:fixed了我无法避免由于我使用的固定侧边栏function,它包含了正文中的所有内容并将其封装在一个单独的div中。 为了抵消这个问题,我正在考虑使用以下代码动态更改模态的位置 – $(‘.modal’).on(‘show.bs.modal’, function (e) { e.preventDefault(); $(this).appendTo(“body”).modal(‘show’); }); 这样做只是在控制台中给了我一个 jquery.js:1 。 这个修复程序曾经在bootstrap 2中完美地工作。 编辑 – 接下来尝试了 $(‘.modal’).on(‘show.bs.modal’, function (e) { e.preventDefault(); console.info(e); $(e.target).appendTo(‘body’).modal(‘show’); }); 但是由于它陷入了无限循环,这显然会让它变得混乱。 一旦我找到一种有效的方法一次检测同一模态上的多个节目事件,我猜它会好起来的。

单击按钮后如何重置Bootstrap-select的值

我正在使用Bootstrap-select插件( https://silviomoreto.github.io/bootstrap-select/ )作为我的下拉选择框。 单击按钮后,我想要刷新框并重置“选中”选项。 这是下拉列表 Default One Two Three 这是我的尝试,不起作用。 关于它应该如何的任何想法? $(“#dataPicker option:selected”).val(‘default’); $(“#dataPicker”).selectpicker(“refresh”);

带有动态项目的Bootstrap Carousel不会滑动

我正在使用股票引导转盘: …. 通过单击旋转木马内的锚标签,将新的.item注入.carousel-inner 。 在注入.item (工作正常)之后,旋转木马应该滑到那个.item 。 然而,没有任何反应。 …. …. …. 即使我使用$(“#main-navigation-carousel”).carousel(1); 在浏览器控制台中没有任何反应 如果我在服务器上的代码中添加项目一切正常。

Bootstrap-select on click get clicked value

我正在使用jQuery插件: bootstrap-select.js我的HTML是select(multiple) – >选项。 当用户选择或取消选择该选项时,我想获取当前单击的选项值。 示例 :用户选择项目4 = console.log项目4.然后用户还选择项目2 = console.log项目2.目前我正在获取项目4,项目2 …它们总是在数组中而不是个体。 我的最终目标是根据用户选择的内容显示和隐藏页面上的div。 将有多个选择选项字段。 HTML代码: 2″> Item 1 Item 2 Item 3 Item 4 Item 5 Item 6 JS代码: $(“select#team”).on(“change”, function(value){ var This = $(this); var selectedD = $(this).val(); console.log(selectedD); }); 当前输出: [“item 1”, “item 3”, “item 4”, “item 5”] 插件站点: bootstrap-select