'rotate the text inside the span element
I have plan to make a simple animation inside the webpage for demonstrate the motor rpm . the span element look like this
<span id="motor" style='font-size:100px;padding: 3%;'>⊖</span>
and my range slider for change the speed is
<input type="range" min="0" max="100" value="0" class="slider" id="Range0" step="5" onchange="changeSpeed(this.value);" >
I add the button which set the new speed for motor and its function is
function changeSpeed(speed){
setInterval( rotate_fan ,speed );
}
function rotate_fan(){
var div = document.getElementById('motor');
deg0=deg0+direction0*10;
div.style.webkitTransform = 'rotate('+deg0+'deg)';
div.style.mozTransform = 'rotate('+deg0+'deg)';
div.style.msTransform = 'rotate('+deg0+'deg)';
div.style.oTransform = 'rotate('+deg0+'deg)';
div.style.transform = 'rotate('+deg0+'deg)';
}
but I didn't see any change any tips really appreciated
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
Solution | Source |
---|