JSFiddle - React, Tailwind, and code Playground

HTML

<div class="content-wrapper">
    <div class="content">
        <p>Ham hock ground round pastrami, andouille ball tip ribeye cow. Shankle pastrami turkey, venison short loin spare ribs ribeye pork belly pork brisket. Pastrami beef ribs chicken short loin. Chuck andouille strip steak swine brisket, tail hamburger beef ribs jerky spare ribs tongue pork belly pastrami bresaola pork. Short ribs brisket pork chop, rump tenderloin pork loin pancetta hamburger short loin sirloin shoulder salami andouille. Turkey corned beef short loin, tenderloin beef ribs hamburger sausage spare ribs beef bacon venison. Beef ribs ham corned beef andouille tongue, jowl shoulder rump.</p>
        
        <p>Shankle bresaola strip steak, t-bone pancetta meatloaf pork loin pork belly andouille. Pork loin ground round rump jowl tenderloin shank t-bone chuck, bacon pork strip steak shoulder brisket beef. Tenderloin pork belly biltong meatball bresaola flank. Biltong shankle drumstick, short loin shank boudin pork chop shoulder meatloaf ribeye tri-tip pork loin corned beef pork belly pancetta. Biltong beef jerky strip steak shoulder sirloin, shank turkey tri-tip chuck pig ground round cow. Turkey ham hock pig, hamburger shoulder tongue jerky short loin brisket. Pork chop corned beef ham hock shank shoulder headcheese sirloin.</p>
        
        <p>Pig bacon shoulder shankle. Drumstick headcheese corned beef, pastrami tail tenderloin turkey andouille boudin venison. Chuck sausage bresaola, ham andouille shoulder ball tip tri-tip t-bone. Tri-tip drumstick biltong chuck tenderloin pastrami, ground round brisket jowl bresaola. Pork loin jerky tongue bresaola, sirloin tail pork belly ham hock ribeye ground round ball tip spare ribs chicken pancetta shoulder. Tri-tip brisket turkey jowl, hamburger tail chicken chuck shoulder pig. Cow bacon ham, rump turkey pancetta pig pork belly beef ribs shankle.</p>
        
        <p>Meatloaf bacon ribeye, strip steak hamburger sirloin drumstick ham tail...

CSS

p { padding: 10px; }
.results { padding: 20px;}

div { padding-top: 10px; padding-bottom:10px; margin: 0 }
.content-wrapper { overflow-y: scroll; height:100px }

JavaScript

$(function() {

    $(".content-wrapper").scroll(function() {
        var $w = $(this),
            scroll_top = $w.scrollTop(),
            total_height = $w.find(".content").height(),
             // 20 is the padding top and bottom of .content
            viewable_area = $w.height() - 20,
            scroll_percent = Math.floor((scroll_top + viewable_area) / total_height * 100);
        $("#output").text(scroll_percent);

    });


});