Tag: twitter bootstrap

jQuery show.bs.collapse event for nested Bootstrap collapsible buttons fires on more buttons than expected

I’m using Bootstrap to make collapsible nested divs/buttons. I want to collapse all siblings of a div when it’s expanded and to collapse all children of a div when it’s collapsed (so that the expanded divs are from only one path from one of the root divs to an inner div). I chose to do […]

Prevent dialog on mobile screen from scrolling the body

I’m displaying a dialog on a mobile screen that’s longer than the size of the screen (so it scrolls). Here’s the problem: When you scroll past the bottom of the dialog (I happen to be using Bootstrap 3), I expect it to just stop. Instead, it starts scrolling the underlying body. I’ve tried everything that’s […]

Current state of bootstrap collapse stored in HTML5 Storage

I’m not sure if this is possible, but I hope someone can direct me in the right direction to achieve what I wish to achieve. I’m building a website around bootstrap from twitter; I use bootstrap collapse on a section box. This box isn’t collapsed by default, but if a user pushes a button and […]

Bootstrap 3: Nested tab

I am trying to put a tab inside of a tab, but whenever I click a inner nested tab, the entire inner nested tab row goes away. Here is an example in a jsfiddle http://jsfiddle.net/jNWMY/1/ Try clicking “Acquisitions/Facebook” tab. You will notice the second row of tabs just disappear. Here is my code <h1> Dashboard […]

Bootstrap make accordion collapse by clicking heading?

How can I make my accordion collapse after clicking the heading rather than just the text in the heading? Right now it only collapses when I click “Major”. JSFiddle: http://jsfiddle.net/P63pp/ My accordion html: <div class=”panel-group” id=”accordion”> <div class=”panel panel-default”> <div class=”panel-heading”> <h4 class=”panel-title”> <a data-toggle=”collapse” data-parent=”accordian” href=”#collapseMajor”> Major </a> </h4> </div> <div id=”collapseMajor” class=”panel-collapse collapse […]

Bootstrap Tabs – Prevent scrolling to top

This is the layout of my tabs. T1 and T2 are normal tab section. There is cascading tabs inside T3. Please find the markup below: <ul class=”nav nav-tabs” id=”myTab”> <li class=”active”><a href=”#T1″>Tab1</a></li> <li class=””><a href=”#T2″>Tab2</a></li> <li class=””><a href=”#T3″>Tab3</a></li> </ul> <div id=”myTabContent” class=”tab-content”> <div class=”tab-pane” id=”T2″> Tab 2 Content… </div> <div class=”tab-pane” id=”T3″> <div class=”tabbable tabs-left”> […]

How to make checkboxes behave like radio buttons in ng-repeat?

I have faced problem to use Checkbox behave like radio button in ng-repeat. Where select and unselect the box and one time only one box will be selected. It is working Without Ng-repeat. But i want to use this in ng-repeat. Here is my HTML File : <!DOCTYPE html> <html ng-app=”plunker”> <head> <meta charset=”utf-8″ /> […]

Twitter-Bootstrap respond.js not working for IE8

I’m still having some problems getting my Twitter-Bootstrap page to display the desktop view correctly in IE8. I’ve been following a few threads here but the voted up advice is just not working for me. Using the suggested meta tag <meta http-equiv=”X-UA-Compatible” content=”IE=edge”> Included local versions of bootstrap.css, html5shiv.js, respond.js, ie8-responsive-file-warning.js Here is my head […]

Bootstrap: Link stays selected after click

Code: <h1><a href=”#”>link</a></h1> <script> $(“a”).click(function (e) { e.preventDefault(); }); </script> http://jsfiddle.net/U7Y3r/ After the link has been clicked, it keeps a small border: I have seen this under Firefox and Internet Explorer 10. Does not occur under Chrome or without Bootstrap.

Using parsley on a wizard form (3 steps)

I’m working on a form based on a Twitter Bootstrap tab. I use Parsley for validation form. I would like to validate only the fields on my first tab (step 1) before clicking on the next button that go to step 2. Is there a way to do that? Cheers.