-
Vertical Carousel with image slide-over
I have created a vertical Bootstrap Carousel here:
http://www.daveparks.net/woodspoole/
The carousel is working nicely, but I would like to have the previous image stay in place and have the next image slide overtop of it, instead of the previous image being "pushed" up. Here is the CSS snippet I am using to achieve the vertical slides. Any ideas? Thanks!
.carousel-inner> .item.next, .carousel-inner > .item.active.right {
transform: translate3d(0, 100%, 0);
-webkit-transform: translate3d(0, 100%, 0);
-ms-transform: translate3d(0, 100%, 0);
-moz-transform: translate3d(0, 100%, 0);
-o-transform: translate3d(0, 100%, 0);
top: 0;
}
.carousel-inner > .item.prev, .carousel-inner > .item.active.left {
transform: translate3d(0,-100%, 0);
-webkit-transform: translate3d(0,-100%, 0);
-moz-transform: translate3d(0,-100%, 0);
-ms-transform: translate3d(0,-100%, 0);
-o-transform: translate3d(0,-100%, 0);
top: 0;
}
.carousel-inner > .item.next.left, .carousel-inner > .item.prev.right, .carousel-inner > .item.active {
transform:translate3d(0,0,0);
-webkit-transform:translate3d(0,0,0);
-ms-transform:translate3d(0,0,0);
-moz-transform:translate3d(0,0,0);
-o-transform:translate3d(0,0,0);
top:0;
}
Posting Permissions
- You may not post new threads
- You may not post replies
- You may not post attachments
- You may not edit your posts
-
Forum Rules