diff options
| author | Martijn Cuppens <martijn.cuppens@gmail.com> | 2018-02-19 12:10:25 +0300 |
|---|---|---|
| committer | Johann-S <johann.servoire@gmail.com> | 2018-02-19 12:10:25 +0300 |
| commit | 3dd0bde664699fc7a191d0d3569f4f0ba8f06028 (patch) | |
| tree | ff42d0fc35221dd53aede05d99491b4b812866bb /js/tests/visual/carousel.html | |
| parent | c381d199655586d949a0929868bea889aed46fa8 (diff) | |
Fix carousel transition duration (#25218)
Diffstat (limited to 'js/tests/visual/carousel.html')
| -rw-r--r-- | js/tests/visual/carousel.html | 15 |
1 files changed, 13 insertions, 2 deletions
diff --git a/js/tests/visual/carousel.html b/js/tests/visual/carousel.html index f81dc951e7..e19272c2d0 100644 --- a/js/tests/visual/carousel.html +++ b/js/tests/visual/carousel.html @@ -5,12 +5,17 @@ <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <link rel="stylesheet" href="../../../dist/css/bootstrap.min.css"> <title>Carousel</title> + <style> + .carousel-item { + transition: transform 2s ease, opacity .5s ease; + } + </style> </head> <body> <div class="container"> <h1>Carousel <small>Bootstrap Visual Test</small></h1> - <p>Also, the carousel shouldn't slide when its window/tab is hidden. Check the console log.</p> + <p>The transition duration should be around 2s. Also, the carousel shouldn't slide when its window/tab is hidden. Check the console log.</p> <div id="carousel-example-generic" class="carousel slide" data-ride="carousel"> <ol class="carousel-indicators"> @@ -46,9 +51,15 @@ <script> $(function() { + var t0, t1; + // Test to show that the carousel doesn't slide when the current tab isn't visible + // Test to show that transition-duration can be changed with css $('#carousel-example-generic').on('slid.bs.carousel', function(event) { - console.log('slid at ', event.timeStamp) + t1 = performance.now() + console.log('transition-duration took' + (t1 - t0) + 'ms, slid at ', event.timeStamp) + }).on('slide.bs.carousel', function() { + t0 = performance.now() }) }) </script> |