使用向左和向右导航键浏览灯箱

Question

我可以通过单击按钮来移至上一张和下一张图像，但是我不知道如何使用向左和向右箭头键来移动它。

我的图片具有以下代码：

                    <div class="hovereffect">
                    <img class="img-responsive" src="photography/photo7.jpg" alt="" onclick="openModal();currentSlide(1)">
                    <div class="overlay" onclick="openModal();currentSlide(1)">
                        <h6>Scary beautiful</h6>
                        <p class="info">Jan 5 2019</p>
                    </div>
                    </div>

我的模态有以下代码：

<div class="my-slides">
                    <div class="numbertext">1/7</div>
                    <img src="photography/photo7.jpg" class="landscape-image">
                    <div class="modal-title">Scary beautiful</div>
                    <div class="modal-date">Jan 5 2019</div>
                </div>
<a class="prev" id="prev" onclick="changeSlides(-1)"><img src="images/left-arrow.svg" style="width:30px;"></a>
                <a class="next" onclick="changeSlides(+1)" onkeydown="changeSlides(+1)"><img src="images/right-arrow.svg" style="width:30px;"></a>

这是我的javascript：

<script>

        function openModal(){
            document.getElementById('my-modal').style.display = "inline-flex";
            document.body.style.overflow = "hidden";
        }
        function closeModal() {
            document.getElementById('my-modal').style.display = "none";
        }

        var slideIndexJS = 1;
        showSlides(slideIndexJS);

        function changeSlides(n){
            showSlides(slideIndexJS += n)
        }
        function currentSlide(n){
            showSlides(slideIndexJS = n)
        }

        function showSlides(n){
            var i;
            var slidesJS = document.getElementsByClassName("my-slides");
            if (n > slidesJS.length) { slideIndexJS = 1;}
            if (n < 1) { slideIndexJS = slidesJS.length;}
            for (i = 0; i < slidesJS.length; i++){
                slidesJS[i].style.display = "none"
            }
            slidesJS[slideIndexJS - 1].style.display = "block";
        }

    </script>

有人可以帮我添加可单击按钮或触发功能的javascript / jquery代码吗？