|
|
- <!doctype html>
- <html>
- <head>
- <title>Spy30 Slideshow</title>
- <link rel="stylesheet" href="/slideshow/css/simple-slideshow-styles.css"">
- <style>
- body {
- color: #212121;
- font-family: "Helvetica Neue", "Calibri Light", Roboto, sans-serif;
- -webkit-font-smoothing: antialiased;
- -moz-osx-font-smoothing: grayscale;
- letter-spacing: 0.02em;
- background: black;
- }
- * {
- margin: 0;
- padding: 0;
- }
- </style>
- </head>
- <body>
-
- <div class="bss-slides">
- @foreach($photos as $photo)
- <figure>
- <img src="{{ $photo['img'] }}" width="100%"/>
- <figcaption>{{ $photo['description'] }}</figcaption>
- </figure>
- @endforeach
- </div>
-
- <script src="/slideshow/js/better-simple-slideshow.min.js"></script>
- <script>
-
- var opts = {
- selector: ".bss-slides",
- auto: {
- // speed to advance slides at. accepts number of milliseconds
- speed : 6000,
- // pause advancing on mouseover? accepts boolean
- pauseOnHover : true
- },
- // show fullscreen toggle? accepts boolean
- fullScreen : true
- };
-
- makeBSS('.bss-slides', opts);
- </script>
-
- </body>
- </html>
|
