왼쪽 및 오른쪽 화살표가있는 이미지의 간단한 페이드 인 및 아웃

를 right누를 때 다음으로 이동 click하려면 이미지 에서 이벤트를 트리거하십시오.

$("body").keydown(function (e) {
    if(e.keyCode == 39) { // right
        $('.images img:visible').trigger('click');
    }
});

데모 .

이제 양방향 탐색을 위해 조정할 수 있다고 믿습니다.

전체 코드. 마크 업-

<div class="images">
    <img src="images/1.jpg" width="1920" alt="1">
    <img src="images/2.jpg" width="1920" alt="2">
    <img src="images/3.jpg" width="1920" alt="3">
    <img src="images/4.jpg" width="1920"  alt="4">
    <img src="images/5.jpg" width="1920"  alt="5">
    <img src="images/6.jpg" width="1920" alt="6">
    <img src="images/7.jpg" width="1920" alt="7">
    <img src="images/8.jpg" width="1920" alt="8">
    <img src="images/9.jpg" width="1920" alt="9">
    <img src="images/10.jpg" width="1920" alt="10">
</div>

자바 스크립트-

$(document).ready(function () {
    var $images;
    var goNext = function (event, direction) {
        var $this = $(this),
            $next;

        if (direction == 'left') {    
            $next = $this.prev('img').length > 0 ? 
                    $this.prev('img') : 
                    $this.siblings('img:last');
        }
        else {
            $next = $this.next('img').length > 0 ? 
                    $this.next('img') : 
                    $this.siblings('img:first');
        }

        $this.hide();
        $next.show();

        return false;
    };

    $images = $('.images img');
    $images.eq(0)
        .siblings()
        .hide();
    $images.on('click', goNext);

    $("body").keydown(function(e) {
        if (e.keyCode == 39) { // right
            $('.images img:visible').trigger('click', 'right');
        }
        else if (e.keyCode == 37) { // left
            $('.images img:visible').trigger('click', 'left');
        }
    });
});