Carousel - Slide Up bootstrap

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<div id="carousel-example-generic" class="carousel slide vertical" data-ride="carousel" data-interval="false">
    <!-- Indicators -->

    
    <!-- Wrapper for slides -->
    <div class="carousel-inner" role="listbox">
        <div class="item active">
 <p>Mr Ling Ong Ong V.S.</p>
<p>Mr Wong Hier chai</p>
        </div>
        <div class="item">
    <p>Mr wrewrLing Ong Ong V.S.</p>
<p>Mr Wong Hewrwerwerier chai</p>
        </div>
    </div>
    </div>    
 
<div id="carousel-example-generic1" class="carousel slide vertical" data-ride="carousel" data-interval="false">
    <!-- Indicators -->

    
    <!-- Wrapper for slides -->
    <div class="carousel-inner" role="listbox">
        <div class="item active">
 <p>Mr Ling Ong Ong V.S.</p>
<p>Mr Wong Hier chai</p>
        </div>
        <div class="item">
    <p>Mr wrewrLing Ong Ong V.S.</p>
<p>Mr Wong Hewrwerwerier chai</p>
        </div>
    </div>
    </div>    
    
    <script>
     function abc() {
            jQuery('.carousel.vertical').carousel('next');
    };
        setInterval(abc, 3000);
    });
</script>

CSS

.vertical .carousel-inner {
    height: 100%;
}
.carousel.vertical .item {
    -webkit-transition: 0.6s ease-in-out top;
    -moz-transition: 0.6s ease-in-out top;
    -ms-transition: 0.6s ease-in-out top;
    -o-transition: 0.6s ease-in-out top;
    transition: 0.6s ease-in-out top;
}
.carousel.vertical .active {
    top: 0;
}
.carousel.vertical .next {
    top: 50px;
}
.carousel.vertical .prev {
    top: -50px;
}
.carousel.vertical .next.left,
.carousel.vertical .prev.right {
    top: 0;
}
.carousel.vertical .active.left {
    top: -50px;
}
.carousel.vertical .active.right {
    top: 50px;
}
.carousel.vertical .item {
    left: 0;
}