我想创建一个轮播（class=“carousel-inner”）并在其中显示一个图标（class=“scroll-icon”）。但是我不能让它响应，所以图标的位置不能响应。如何做出一个反应灵敏的旋转木马-内部？

大屏幕

小屏幕（蓝色区域属于旋转木马-内部）

<div class="home">

        <div class="banner">

            <div id="carouselExampleSlidesOnly" class="carousel slide d-none d-md-block " data-ride="carousel">
                <div class="carousel-inner " style="height: 1300px ">
                    <div class="carousel-item active" data-aos="fade-in">
                        <img class="d-block w-100 img-fluid" data-aos="fade-down" src="{{asset('images/home/deneme.jpg')}}" alt="First slide" >
                    </div>
                    <div class="carousel-item" data-aos="fade-in">
                        <img class="d-block w-100 img-fluid" data-aos="fade-in" src="{{asset('images/home/carousel2.jpg')}}" alt="Second slide">
                    </div>
                    <div class="carousel-item" data-aos="fade-in">
                        <img class="d-block w-100 img-fluid" data-aos="fade-in" src="{{asset('images/home/carousel3-2.jpg')}}" alt="Third slide">
                    </div>
                </div>
            </div>
        

            <img class="scroll-icon" style="position: absolute; z-index: 999999999999; left: 50%; top:700px" src="{{asset("/images/scroll.svg")}}"/>

        </div>