rotate text at button click even code (having issue)
<style type="text/css" media="screen">
.square {
width: 144px;
height: 144px;
background: #fff;
margin-right: 48px;
float: left;
}
.transformed {
-webkit-transform: rotate(15deg) scale(1.25, 0.5);
-moz-transform: rotate(15deg) scale(1.25, 0.5);
transform: rotate(15deg) scale(1.25, 0.5);
}
</style>
<script type="text/javascript">
function change(txt){
var d = document.getElementById('derg').value;alert(d);
//alert(txt);
//alert(d);
//var a1=5;
//var a2=5;
//var a3=a1+a2;
//alert(a3);
var dd = d+txt;
alert(dd);
document.getElementById('derg').value=dd;
var a=dd+'deg';
//alert(a);
document.getElementById('tdiv4').style.MozTransform = 'rotate('+a+')';
}
</script>
<div id="tdiv4" class="square" >this is tdiv4</div>
<input type="hidden" value="" id="derg"开发者_如何转开发>
<input type="button" onclick="change(20)" value="change"/>
Rotation is perfectly but issue is its not add previous value to new value its concate both value i dont want concatenation.suppose previous value 20 and new value again 2o then rotation angle should be 40deg.but it show rotation angle 2020 thats the issue.so please help me
JSFiddle
function change(txt){
var d = document.getElementById('derg').value || 0;
var dd = parseInt(d)+parseInt(txt);
document.getElementById('derg').value=dd;
var a=dd+'deg';
document.getElementById('tdiv4').style.MozTransform = 'rotate('+a+')';
}
it did need parseInt but it also needed to have an initial value, so in my example if it has no value it will take 0
You need to convert your d and txt values from strings to numbers. e.g.
var number = parseInt(d);
You can test first for NaN errors with isNan, e.g.
if (!isNaN(d)) {
var number = parseInt(d);
}
精彩评论