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);
}