$(document).ready(function() {
    var index = 0;
    var swiper = function() {
        $('img').eq(index).css({ 'opacity': '1' }).siblings().css({ 'opacity': '0' });
    }
    $(document).on('mouseenter','a',function(){
        index=$(this).index();
        swiper();
    })
    $(document).on('keydown',function () { 
        if (event.keyCode == 37) {
            if(index==0){
                index=$("a").length-1;
            }else{
                index --;
            }
            swiper();
        } else if (event.keyCode == 39) {
            if(index==$("a").length-1){
                index=0;
            }else{
                index ++;
            }
            swiper();
        }
    });
});

//
//
//第三个bug根本没遇到 而第一二个bug和默认显示第一张图片
//只需要在第一个img加个z-index就全部解决了
 <img src="images/1.jpg" style="z-index: 999">