Skip to content

Instantly share code, notes, and snippets.

@bryanjamesmiller

bryanjamesmiller/gist:c14e623152ab9b5f9246

Created February 12, 2015 02:03
Show Gist options
  • Save bryanjamesmiller/c14e623152ab9b5f9246 to your computer and use it in GitHub Desktop.
Save bryanjamesmiller/c14e623152ab9b5f9246 to your computer and use it in GitHub Desktop.
Download ZIP
What the generated HTML/JS looks like
Raw
gistfile1.txt
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<!-- Bootstrap content start -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Latest compiled and minified JQuery -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap-theme.min.css">
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
</head>
<body>
<button type="button" id="change_button_label_0" data-toggle="collapse" data-target="#button_number_0" class="btn btn-warning"><span class="glyphicon glyphicon-chevron-down"></span>Expand</button>
<div id="button_number_0" class="collapse">
This gets collapsed #0 </div>
<script>
$('#change_button_label_0').click(function () {
if($('button span').hasClass('glyphicon-chevron-up'))
{
$('#change_button_label_0').html('<span class="glyphicon glyphicon-chevron-down"></span>Expand');
}
else
{
$('#change_button_label_0').html('<span class="glyphicon glyphicon-chevron-up"></span>Collapse');
}
});
</script>
<button type="button" id="change_button_label_1" data-toggle="collapse" data-target="#button_number_1" class="btn btn-warning"><span class="glyphicon glyphicon-chevron-down"></span>Expand</button>
<div id="button_number_1" class="collapse">
This gets collapsed #1 </div>
<script>
$('#change_button_label_1').click(function () {
if($('button span').hasClass('glyphicon-chevron-up'))
{
$('#change_button_label_1').html('<span class="glyphicon glyphicon-chevron-down"></span>Expand');
}
else
{
$('#change_button_label_1').html('<span class="glyphicon glyphicon-chevron-up"></span>Collapse');
}
});
</script>
<button type="button" id="change_button_label_2" data-toggle="collapse" data-target="#button_number_2" class="btn btn-warning"><span class="glyphicon glyphicon-chevron-down"></span>Expand</button>
<div id="button_number_2" class="collapse">
This gets collapsed #2 </div>
<script>
$('#change_button_label_2').click(function () {
if($('button span').hasClass('glyphicon-chevron-up'))
{
$('#change_button_label_2').html('<span class="glyphicon glyphicon-chevron-down"></span>Expand');
}
else
{
$('#change_button_label_2').html('<span class="glyphicon glyphicon-chevron-up"></span>Collapse');
}
});
</script>
<button type="button" id="change_button_label_3" data-toggle="collapse" data-target="#button_number_3" class="btn btn-warning"><span class="glyphicon glyphicon-chevron-down"></span>Expand</button>
<div id="button_number_3" class="collapse">
This gets collapsed #3 </div>
<script>
$('#change_button_label_3').click(function () {
if($('button span').hasClass('glyphicon-chevron-up'))
{
$('#change_button_label_3').html('<span class="glyphicon glyphicon-chevron-down"></span>Expand');
}
else
{
$('#change_button_label_3').html('<span class="glyphicon glyphicon-chevron-up"></span>Collapse');
}
});
</script>
<button type="button" id="change_button_label_4" data-toggle="collapse" data-target="#button_number_4" class="btn btn-warning"><span class="glyphicon glyphicon-chevron-down"></span>Expand</button>
<div id="button_number_4" class="collapse">
This gets collapsed #4 </div>
<script>
$('#change_button_label_4').click(function () {
if($('button span').hasClass('glyphicon-chevron-up'))
{
$('#change_button_label_4').html('<span class="glyphicon glyphicon-chevron-down"></span>Expand');
}
else
{
$('#change_button_label_4').html('<span class="glyphicon glyphicon-chevron-up"></span>Collapse');
}
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment