Евгений

Как оптимизировать прыгающий слайдер?

::-webkit-scrollbar {
	width: 10px;
	background-color: rgba(0, 0, 0, 0);
	border-radius: 100px;
}

::-webkit-scrollbar:hover {
	background-color: rgba(0, 0, 0, 0.09);
}

::-webkit-scrollbar-thumb:vertical {
	background: rgba(0, 0, 0, 0.5);
	border-radius: 100px;
	background-clip: padding-box;
	border: 2px solid rgba(0, 0, 0, 0);
	min-height: 10px;
}

::-webkit-scrollbar-thumb:vertical:active {
	background: rgba(0, 0, 0, 0.61);
	border-radius: 100px;
}

Попробуйте так: делаем показ только одного слайда, следующий слайд будет с translateX(-300px) например и в чб. Можно через active этим управлять

https://codepen.io/satantx/pen/exRedq

добавьте на tr класс, например element

<script>
  $(document).ready(function(){
    $('button').on('click', function() {
var element = $(this).parents('.element');
      var bank_id = $('input.bank_id', element ).val();
      var id = $('input.id', element ).val();
      $.ajax({
        method: 'POST',
        url: 'bank_id_by_name_ajax.php',
        data: {id: id, bank_id: bank_id}
      })
      .done(function() {
        
      }
      )
    }
    )
  })
</script>

я делаю так: родителю слайдов делаю display: flex; слайдам opacity: 0; когда слик загружается и слайдер инициализируется, то он добавляет родителю класс, через него убираю слайдам opacity и вуаля)

PS: и вот можно родителю бэкграундом сделать прелоудер

$('.main_nav a[href^="#"]').click(function () {

Можно вставить кнопку с reset и стилизовать как надо, а можно на js написать событие при клике на див, чтобы очищал поля

$('div').click(function(){
  $('input[type=text]').each(function(){
    $(this).val('');
  });
  $('form').trigger('reset');
});