0

Preciso atribuir para alguma variável o style inline de uma div, antes dela ser modificada:

O exemplo abaixo é o que eu espero que aconteça, porém eu não posso forçar 'top', '100px' no segundo botão e sim recuperar o valor original que está dentro do style inline da div box.

$('.top-1000').click(function(){
  $('.box').css('top','200px');
});

$('.back-100').click(function(){
  $('.box').css('top','100px');
});
body{
position:relative;
}
.box{
height:100px;
width:100px;
background:red;
position:absolute;
left:0;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="box" style="top: 100px;">

</div>

<button class="top-1000">Go</button>
<button class="back-100">Go back</button>

1
  • Não entendi muito bem, pode explicar um pouco mais? Commented 23/01/2018 às 17:39

1 Resposta 1

1

Claro, basta guardares o valor da propriedade que queres antes de qualquer alteração, usando a versão getter do método css():

var original_val = $('.box').css('top'); // <-- acrescentar isto
$('.top-1000').click(function(){
  $('.box').css('top','200px');
});

$('.back-100').click(function(){
  $('.box').css('top',original_val); // <-- repor original_val
});
body{
position:relative;
}
.box{
height:100px;
width:100px;
background:red;
position:absolute;
left:0;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="box" style="top: 100px;">

</div>

<button class="top-1000">Go</button>
<button class="back-100">Go back</button>

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .