Animate a Text Block on Scroll

To animate a text block from left to right on Scroll, you can follow these.
#1. Find ID of Text Block.
In my example, we will have: #block-yui_3_17_2_1_1728966866271_9684

#2. Use this code to Page Header Injection (Page where you use Text Block)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
  $(window).scroll(function() {
    var element = $('#block-yui_3_17_2_1_1728966866271_9684');
    var elementTop = element.offset().top;
    var viewportBottom = $(window).scrollTop() + $(window).height();

    if (viewportBottom > elementTop) {
      element.addClass('slide-left');
    }
  });
});

</script>
<style>
  #block-yui_3_17_2_1_1728966866271_9684 {
  transform: translateX(-400px);
    transition: all 1.2s ease;
  }
  #block-yui_3_17_2_1_1728966866271_9684.slide-left {
  transform: translateX(0) !important;
    transition: all 1.5s ease;
  }
</style>