https://www.albertsjewelers.com/skeleton/1.0/view/js/firstImageCarousel.js?v=2.6

1$(document).ready(function(){
2    var carouselsGrapesjs = $('#main [data-type="bst-carousel"]').first();        
3    if(carouselsGrapesjs.length){
4        var main_page = $('#main');    
5        var relativeTop = carouselsGrapesjs.offset().top - main_page.offset().top;
6
7        let deviceType = 'desktop';
8
9        if (window.matchMedia("(max-width: 767px)").matches) {
10            deviceType = 'mobile';
11        } else if (window.matchMedia("(max-width: 999px)").matches) {
12            deviceType = 'tablet';
13        }
14
15        let imgIndex = 0;
16        if (deviceType === 'tablet') {
17            imgIndex = 1;
18        } else if (deviceType === 'mobile') {
19            imgIndex = 2;
20        }
21
22        if(relativeTop < 300 && carouselsGrapesjs.prev('.carousel-placeholder').length === 0){
23            var firstVisibleImg = carouselsGrapesjs.find('img').filter(function () {
24                return $(this).css('display') !== 'none';
25            }).first();
26
27            if (firstVisibleImg.length) {
28                
29                var placeholderImg = firstVisibleImg.clone()
30                    .removeAttr('loading')
31                    .addClass('carousel-placeholder')
32                    .css({margin: '0 auto'});
33                
34                carouselsGrapesjs.before(placeholderImg);
35                
36                firstVisibleImg.addClass('first-image-carousel');
37                $(firstVisibleImg).hide(); 
38            }            
39        }    
40    }   
41});