JSFiddle - React, Tailwind, and code Playground

HTML

<div class="outer">
    <div class="news">
        <h4>News</h4>
        <p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut suscipit dui ac lacus convallis dapibus. In cursus arcu at arcu mollis vestibulum. Morbi ac quam sed nisl vulputate aliquam in ac velit. Curabitur ac feugiat justo. Fusce imperdiet, arcu non dignissim vulputate, leo odio ultricies mauris, in consectetur risus odio malesuada sapien. Nam sagittis convallis dictum. Duis eget lectus
        </p>
        <div class="fadeout">
            <div class="fadeline o01"></div>
            <div class="fadeline o02"></div>
            <div class="fadeline o03"></div>
            <div class="fadeline o04"></div>
            <div class="fadeline o05"></div>
            <div class="fadeline o06"></div>
            <div class="fadeline o07"></div>
            <div class="fadeline o08"></div>
            <div class="fadeline o09"></div>
            <div class="fadeline o10"></div>
            <div class="fadeline o10"></div>
            <div class="fadeline o10"></div>
            <div class="fadeline o10"></div>
        </div>
    </div>
    <div class="news">
        <h4>News</h4>
        <p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut suscipit dui ac lacus convallis dapibus. In cursus arcu at arcu mollis vestibulum. Morbi ac quam sed nisl vulputate aliquam in ac velit. Curabitur ac feugiat justo. Fusce imperdiet, arcu non dignissim vulputate, leo odio ultricies mauris, in consectetur risus odio malesuada sapien. Nam sagittis convallis dictum. Duis eget lectus
        </p>
        <div class="fadeout">
            <div class="fadeline o01"></div>
            <div class="fadeline o02"></div>
            <div class="fadeline o03"></div>
            <div class="fadeline o04"></div>
            <div class="fadeline o05"></div>
            <div class="fadeline o06"></div>
            <div class="fadeline o07"></div>
            <div class="fadeline o08"></div>
            <div...

CSS

.outer {
    background: url('http://fc02.deviantart.net/fs48/f/2009/230/2/1/Random_Background_____by_Demon_Hitori.jpg') repeat fixed;
    height: 200px;
    overflow: auto;
    color: #fff;
    font-family: sans-serif;
    font-size: 10pt;
}

.news {
    position: relative;
    width: 300px;
    height: 100px;
    overflow: hidden;
}

.news h4 {
    margin-bottom: 5px;
    font-weight: bold;
}

.news .fadeout {
    position: absolute;
    bottom: 0;
    width: 100%;
}

.news .fadeout .fadeline {
    height: 2px;
    background: url('http://fc02.deviantart.net/fs48/f/2009/230/2/1/Random_Background_____by_Demon_Hitori.jpg') repeat fixed;
}

.news .fadeout .o10 {  }
.news .fadeout .o09 { opacity: 0.9; }
.news .fadeout .o08 { opacity: 0.8; }
.news .fadeout .o07 { opacity: 0.7; }
.news .fadeout .o06 { opacity: 0.6; }
.news .fadeout .o05 { opacity: 0.5; }
.news .fadeout .o04 { opacity: 0.4; }
.news .fadeout .o03 { opacity: 0.3; }
.news .fadeout .o02 { opacity: 0.2; }
.news .fadeout .o01 { opacity: 0.1; }