<div id="img-grp-wrap" class="slide-dekstop">
    <div class="img-wrap">
        <img src="img/slider.jpg" />
        <img src="img/slider3.jpg" />
        <img src="img/slider2.jpg" />
    </div>
</div>

#img-grp-wrap {
position: relative;
width: 100%;
}
.img-wrap {
position: relative;
width: 100%;
height: 1000px;
overflow: hidden;
}

<script type="text/javascript">
    $(document).ready(function() {
    var imgFirst = $('#img-grp-wrap .img-wrap img');
    $('#img-grp-wrap .img-wrap img:gt(0)').hide();

    var rotate = setInterval(function() {
        slideShow();
    }, 4000);

    $('#img-grp-wrap .prev, #img-grp-wrap .next').hover(function() {
        clearInterval(rotate);
    }, function() {
        rotate = setInterval(function() {
            slideShow();
        }, 4000);
    });

    $('#img-grp-wrap .next').click(function() {
        imgFirst.filter(":first-child")
        .stop().fadeOut().next().fadeIn().end().appendTo('.img-wrap');
    });

    $('#img-grp-wrap .prev').click(function() {
        imgFirst.filter(":first-child").stop().fadeOut();
        $('#img-grp-wrap .img-wrap img:last-child').prependTo('.img-wrap').fadeOut();
        imgFirst.filter(":first-child").fadeIn();
    });

    });
</script>