JSFiddle - React, Tailwind, and code Playground

HTML

<form >
  Quantity (between 1 and 5): <input type="number" id="scaleImagesBy" min="1" max="5">
  <input type="button" id="scaleImages">
</form>
    
<div class="container">
   
</div>

CSS

.container {
}
.logo-box {
    width:75px;
    float:left;
    /*height:150px;
    border: 1px dotted black; */
}

JavaScript

$(function () {
    var i;
    var container = $(".container");
    for(i = 0; i < 10000; i++) {
        container.append($("<img src='http://www.cs.uofs.edu/~olivetoj2/blah.jpg' class='logo-box' />"));        
    };
});


$(function () {
    var initialWidth = $(".logo-box").width();
    $("#scaleImages").click(function() {
        var scaleBy = $("#scaleImagesBy").val();
        $(".logo-box").width(initialWidth * scaleBy);
    });
   
});


// 
$(function () {
    // Offset
    var fIOFS = 0; // firstItemOffsetFromStart
    // Will need to be updated when children changes from dataview
    var cChildren = $(".container").children();
    
    function calcOffset(docViewBottom) {
        var i;
        for(i = 0, l = cChildren.length; i < l; i++) {
            var child = $(cChildren[i]);
            var top = child.offset().top;
            if(top > docViewBottom) {
                console.log("Current offset " + i);
                break;
            }
        }
    };
    
    
    // Viewport Changed
    var container = $(".container");
    var elementWidth = 150;
    var viewPortChanged =  function() {
            var docViewTop = $(window).scrollTop() + container.offset().top;
            var docViewBottom = docViewTop + $(window).height();
            var docViewWidth = container.width();
            var numberOfItemsInRow = Math.floor(docViewWidth/elementWidth);
        
            calcOffset(docViewBottom);
            //var elemTop = $(elem).offset().top;
            //var elemBottom = elemTop + $(elem).height();
            //return ((elemBottom <= docViewBottom) && (elemTop >= docViewTop));
            console.log("top " + docViewTop);
            console.log("bottom " + docViewBottom);
            console.log("width " + docViewWidth);
            console.log("itemsInRow " + numberOfItemsInRow);
        }
    $(window).on('scroll', viewPortChanged);
    $(window).on('resize', viewPortChanged);
});