"Video Cost Calculator"
Bootstrap 3.3.0 Snippet by DerrickMatthias

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="container"> <div class="row"> <h2>Video Cost Calculator</h2> </div> <div class="row"> <div class="col-sm-offset-4 col-sm-4"> <form method="put"> <div class="form-group"> <label for="age">Do you need a concept, script and storyboard?</label> <div class="input-group"> <select class="form-control" name="activity_level" id="activity_level" required> <option value="a1">I will supply the concept and script</option> <option value="a2">I will share admin and scheduling with Simple Video Marketing</option> <option value="a3">Simple Video Marketing to perform basic scheduling tasks</option> <option value="a4">Simple Video Marketing to perform all scheduling and admin</option> </select> <span class="input-group-addon danger"><span class="glyphicon glyphicon-remove"></span></span> </div> </div> <div class="form-group"> <label for="sex">Sex</label> <div class="input-group" data-toggle="buttons"> <label class="btn btn-default active"><input type="radio" name="sex" value="male" checked="checked">Male</label> <label class="btn btn-default"><input type="radio" name="sex" value="female">Female</label> </div> </div> <div class="form-group"> <label>Weight(lbs)</label> <div class="input-group" data-validate="number"> <input type="text" class="form-control" name="weight" id="weight" placeholder="(lbs)" required> <span class="input-group-addon danger"><span class="glyphicon glyphicon-remove"></span></span> </div> </div> <div class="form-group"> <label>Hieght(inches)</label> <div class="input-group" data-validate="number"> <input type="text" class="form-control" name="inches" id="inches" placeholder="(inches)" required> <span class="input-group-addon danger"><span class="glyphicon glyphicon-remove"></span></span> </div> </div> <div class="form-group"> <label>Activity Level</label> <div class="input-group"> <select class="form-control" name="activity_level" id="activity_level" required> <option value="">Select an Acitivity Level</option> <option value="no">Little to no exercise</option> <option value="light">Light exercise (1−3 days per week)</option> <option value="moderate">Moderate exercise (3−5 days per week)</option> <option value="heavy">Heavy exercise (6−7 days per week)</option> <option value="extreme">Very heavy exercise (twice per day, extra heavy workouts)</option> </select> <span class="input-group-addon danger"><span class="glyphicon glyphicon-remove"></span></span> </div> </div> <div class="form-group"> <label>Choose Goal:</label> <div class="input-group"> <select class="form-control" name="gain_loss_amount" id="gain_loss_amount" required> <option value="">Select a Goal</option> <option value="-1000">Lose 2 Pounds per Week</option> <option value="-750">Lose 1.5 Pounds per Week</option> <option value="-500">Lose 1 Pounds per Week</option> <option value="-250">Lose 0.5 Pounds per Week</option> <option value="0">Stay the Same Weight</option> <option value="250">Gain 0.5 Pound per Week</option> <option value="500">Gain 1 Pound per Week</option> <option value="750">Gain 1.5 Pounds per Week</option> <option value="1000">Gain 2 Pounds per Week</option> </select> <span class="input-group-addon danger"><span class="glyphicon glyphicon-remove"></span></span> </div> <div class="form-group"> <div id="dc_results" class="alert alert-success" style="display: none"> <h4>Estimated Daily Calories:<strong><span id="calAmount"></span></strong></h4> </div> </div> <div class="form-group"> <div class="modal-footer"> <button class="btn btn-danger" onclick="resetForm();">Reset</button> <button type="button" id="calculate" name="calculate" class="btn btn-primary" onclick="calcDailyCals();">Calculate</button> </div> </div> <div class="form-group"> <div class ="modal-footer" id="recommendations" style="display: none"> <h5><strong>Click Below for Recommendations!<strong></h5> <button class="btn btn-primary" onclick="findDiets();">Diets</button> <button class="btn btn-primary" onclick="findWorkouts()">Workouts</button> </div> </div> </div> </div> </form> </div> </div>

Related: See More


Questions / Comments: