I have a problem to get element with jQuery. This is my html, css and jQuery code. Please check it and tell me, how can I get transform value with jQuery?
I need get transform value with jQuery, but I can't; can you help me?
<script>
var movment = 150;
var time=1000;
$('.btn_left').click(function () {
$('.slider').css({
'transform': 'translateX(' movment 'px)',
'transition':time 'ms'
});
movment = movment 150;
})
$('.btn_right').click(function () {
// var getElementtransform=??;
movment = movment - 150;
$('.slider').css({
'transform': 'translateX(' movment 'px)',
'transition':time 'ms'
});
})
</script>
<style>
.slider {
width: 2200px;
height: 200px;
background: #ddd;
margin-bottom: 40px;
float: right;
overflow: hidden;
}
.btn_right {
transform: scale(1.3);
float: right;
cursor: pointer;
}
.btn_left {
float: left;
transform: scale(1.3);
cursor: pointer;
}
.items {
width: 150px;
height: 180px;
margin: 10px 18px;
background: green;
border-radius: 5px;
overflow: hidden;
color: white;
float: right;
font-size: 46px;
text-align: center;
line-height: 156px;
font-family: IRANSansWeb;
}
</style>
<div >
<div >1</div>
<div >2</div>
<div >3</div>
<div >4</div>
<div >5</div>
<div >6</div>
<div >7</div>
<div >8</div>
<div >9</div>
<div >10</div>
</div>
<button >right</button>
<button >left</button>
CodePudding user response:
var getElementtransform=$('.slider')[0].style.transform;
or just the number:
var getElementtransform=Number($('.slider')[0].style.transform.match(/\d /)[0]);