Bootstrap 3 Skeleton
This is a simple Bootstrap skeleton. You can fork it to get a ready to use Bootstrap fiddle.
by vikaskbh
HTML
<script src="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.1.0/bootstrap.min.js"></script>
<div class="code_example">
<select name="languages" id="languages4" multiple>
<option value="c">C</option>
<option value="c++">C++</option>
<option value="php">PHP</option>
<option value="perl">PERL</option>
<option value="ruby">RUBY</option>
<option value="python">PYTHON</option>
<option value="go">GO</option>
</select>
<br/>
<input type="button" class="btn btn-danger" id="remove_multiple" value="Remove Multiple" />
</div>
CSS
@import url('http://getbootstrap.com/dist/css/bootstrap.css');
@import url('http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-theme.min.css');
input[type=text] {
width: 300px;
display:inline;
margin-left: 10px;
}
select {
font-size:24px;
height: 30px;
line-height: 30px;
margin: 10px;
min-width:300px;
}
.code_example {
padding-bottom: 50px;
border-bottom: 1px solid #EEE;
}
h1, h2, h3, h4 {
font-weight:bold;
padding-left: 10px;
}
button {
font-family:arial, sans-serif !important;
}
input[type='button'] {
margin-left: 10px;
}
JavaScript
(function ($) {
$('#remove_multiple').on('click', function () {
var multiple_text_to_remove = $('#languages4').val();
$(multiple_text_to_remove).each(function (k, v) {
$("#languages4")
.find("option[value='" + v + "']")
.remove();
});
});
})(jQuery);