Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <div class="zakaz-form switch-form">Содержимое 1-го блока + 1-я кнопка</div>
- <div class="cons-form switch-form">Содержимое 2-го блока + 2-я кнопка</div>
- .zakaz-form{
- animation: switch-zakaz forwards 3s;
- -webkit-animation-play-state:paused;
- animation-play-state:paused;
- }
- @keyframes switch-zakaz {
- 0% {
- opacity: 1;
- left: 0;
- }
- 20% {
- opacity: 1;
- left: 0;
- }
- 100% {
- opacity: 0;
- left: 95%;
- }
- }
- .cons-form{
- animation: switch-cons forwards 3s;
- -webkit-animation-play-state:paused;
- animation-play-state:paused;
- }
- @keyframes switch-cons {
- 0% {
- opacity: 0;
- left: -1000px;
- }
- 80% {
- opacity: 1;
- left: calc(50% - 275px);
- }
- 100% {
- opacity: 1;
- left: calc(50% - 275px);
- }
- }
- .start-anim {
- -webkit-animation-play-state:running;
- animation-play-state:running;
- }
- jQuery(document).ready(function($){
- $(function(){
- $('.cons-button').click(function(){
- $('.switch-form').toggleClass('start-anim');
- });
- });
- });
Add Comment
Please, Sign In to add comment