Full screen slider display

so why don’t you use the full-width slider then?
it shows all of the image always – even on small screens.

Besides the performance problem you have when you put two sliders on the page, and only show one then depending on the screen width –
think a little bit about your request – how should this work?
The height is the starting point for the image.
This height must fill the screen height, so you have automatically cropping with a landscape image ( If the aspect ratio is not the same as the screen dimensions.)
This is also the case with large screens.
Only the Full Width slider shows you (almost) always the whole image without trimming.

The function above is ok – only in dependence to the device but a function with resize and reload etc. ?Anyway – I think such a script reduces the performance more than loading two sliders – especially since the images are probably identical and in the cache.

this is the result on that page : https://gtmetrix.com/reports/webers-testseite.de/H1Qv5gQ2
no error on that!
This page is a testpage with a child-theme functions.php with 2180 lines
( thats the reason for F’s because of a lot of extra javascript in it)
the quick css has 3000 lines ! my absolute text environment.

you see my test page . -look to the DOM :
it is only one slider at a time there

but i think we had to combine these two functions in one.
you have to have the full-screen slider before header on desktop case and full-width slider is removed
on mobile case there is always the full-width slider – full-screen slider is gone.

no i see that you are taking the one and shift it over the header – but these two functions are working a little on the same thing.
But the one is waiting til the document is ready – so the other one could not do what it has to do.

Try this : Backup your child-theme functions.php.
Then delete both rules – mine and the one that insertBefore Header rule
i mean this one here:

(function($){
    $(document).ready(function($){
        var is_mobile=false;
        if($('.responsive #scroll-top-link').css('display')=='none'){is_mobile=true;}
        if(!is_mobile){$("#main > .avia-fullscreen-slider").insertBefore("#header");}
    });
})(jQuery);

and insert instead this one

function only_one_slider(){
if( is_page(2) ) {  
?>
<script>
(function($){
    $(document).ready(function(){
        $('html.avia_mobile #fullscreen_slider_1').remove();
        $('html.responsive.avia_mobile #scroll-top-link').css( "display", "none");
        $('html.avia_desktop #full_slider_1').remove();
        $('html.avia_desktop #fullscreen_slider_1').insertBefore("#header");
    });    
})(jQuery);
</script>
<?php
}
}
add_action('wp_footer', 'only_one_slider');

we will see then if it works.