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 class="slider">
<div class="items">1</div>
<div class="items">2</div>
<div class="items">3</div>
<div class="items">4</div>
<div class="items">5</div>
<div class="items">6</div>
<div class="items">7</div>
<div class="items">8</div>
<div class="items">9</div>
<div class="items">10</div>
</div>
<button class="btn_right">right</button>
<button class="btn_left">left</button>