Line 8: | Line 8: | ||
<html> | <html> | ||
<head> | <head> | ||
− | + | <style> | |
− | + | .carousel-fade .carousel-inner .item{ | |
+ | opacity:0; | ||
+ | -webkit-transition-property:opacity ; | ||
+ | -moz-transition-property:opacity ; | ||
+ | -ms-transition-property:opacity ; | ||
+ | -o-transition-property:opacity ; | ||
+ | transition-property:opacity ; | ||
+ | } | ||
+ | .carousel-fade .carousel-inner .active{ | ||
+ | opacity: 1; | ||
+ | } | ||
+ | .carousel-fade .carousel-inner .active.left,.carousel-fade .carousel-inner .active.right{ | ||
+ | left: 0; | ||
+ | opacity: 0; | ||
+ | } | ||
+ | .carousel-fade .carousel-inner .next.left,.carousel-fade .carousel-inner .prev.right { | ||
+ | opacity: 1; | ||
+ | } | ||
+ | </style> | ||
</head> | </head> | ||
<body> | <body> | ||
− | <div class="carousel slide" id="myCarousel" data-ride="carousel"> | + | <div class="carousel-fade carousel slide" id="myCarousel" data-ride="carousel"> |
<!-- Indicators --> | <!-- Indicators --> | ||
<ol class="carousel-indicators" style="margin: 0 -30%;"> | <ol class="carousel-indicators" style="margin: 0 -30%;"> |
Revision as of 08:21, 28 September 2018