Industrial JS
Simple Tank example control by input
by aflynt
HTML
<script src="https://brennana.github.io/industrial-js/js/industrial.js"></script>
<link rel="stylesheet" href="https://brennana.github.io/industrial-js/css/industrial.css">
<h3>Culture</h3>
<div class="industrial thermometer size one">
<span class="ticks" data-amount="10"></span>
<div class="space"></div>
<div class="meter warning"></div>
</div>
CSS
@import url(http://fonts.googleapis.com/css?family=Roboto);
h1, input, html {
font-family:'Roboto', sans-serif;
}
label {
margin: 7px;
}
JavaScript
// Time to use some industrial.js!
// This is where we'll initialize our components,
// and change values with a small value simulator.
// Simulate data every 5 seconds
$(document).ready(function() {
setTimeout(function() {
$(".industrial").industrial({});
},250);
// setInterval(function() {
$(".industrial.thermometer").each(function() {
// $(this).industrial(Math.floor(Math.random()*100));
$(this).industrial(100);
});
// }, 10000);
// Also init our introjs!
});