JSFiddle - React, Tailwind, and code Playground

HTML

<h1>
    Keep Overflow Content Scrolling Unresponsive Until Clicked Using jQuery
</h1>

<p>
    Here is a long page; but, on the page, we have another
    area of content that can be scrolled independently using
    CSS overflow.
</p>

<p>
    <strong>Content You Don't Really Care About</strong>:
</p>

<!-- BEGIN: Overflow Content. -->
<a href="javascript:void(0)" class="overflowable">
    <p>
        This is the sub-content area - independently scrollable.
    </p>

    <p>
        This is the sub-content area - independently scrollable.
    </p>
    
    <p>
        This is the sub-content area - independently scrollable.
    </p>
    
    <p>
        This is the sub-content area - independently scrollable.
    </p>
    
    <p>
        This is the sub-content area - independently scrollable.
    </p>
    
    <p>
        This is the sub-content area - independently scrollable.
    </p>
    
    <p>
        This is the sub-content area - independently scrollable.
    </p>
    
    <p>
        This is the sub-content area - independently scrollable.
    </p>
    
    <p>
        This is the sub-content area - independently scrollable.
    </p>
    
    <p>
        This is the sub-content area - independently scrollable.
    </p>
    
    <p>
        This is the sub-content area - independently scrollable.
    </p>
    
    <p>
        This is the sub-content area - independently scrollable.
    </p>
    
    <p>
        This is the sub-content area - independently scrollable.
    </p>
    
    
</a>
<!-- END: Overflow Content. -->

<p class="repeatMe">
    This is part of the main page content.
</p>

CSS

a.overflowable {
    background: #fff;
    display: block;
    border: 2px solid #ccc ;
    cursor: pointer;
    overflow: hidden;
    height: 150px ;
    width: 500px ;
    padding: 1px 16px 1px 16px ;
    text-align: left;
    font: inherit;
    text-decoration: none;
    color: #000;
}

a.overflowable:hover,
a.overflowable:focus,
a.overflowable:active {
    border-color: #FF3399 ;
    overflow: auto;
    pointer: hand;
}