You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

51 lines
1.1 KiB

7 years ago
  1. <!doctype html>
  2. <html>
  3. <head>
  4. <title>Spy30 Slideshow</title>
  5. <link rel="stylesheet" href="/slideshow/css/simple-slideshow-styles.css">
  6. <meta http-equiv="refresh" content="300;url=/slideshow" />
  7. <style>
  8. body {
  9. color: #212121;
  10. font-family: "Helvetica Neue", "Calibri Light", Roboto, sans-serif;
  11. -webkit-font-smoothing: antialiased;
  12. -moz-osx-font-smoothing: grayscale;
  13. letter-spacing: 0.02em;
  14. background: black;
  15. }
  16. * {
  17. margin: 0;
  18. padding: 0;
  19. }
  20. </style>
  21. </head>
  22. <body>
  23. <div class="bss-slides">
  24. @foreach($photos as $photo)
  25. <figure>
  26. <img src="{{ $photo['img'] }}" width="100%"/>
  27. <figcaption>{{ $photo['description'] }}</figcaption>
  28. </figure>
  29. @endforeach
  30. </div>
  31. <script src="/slideshow/js/better-simple-slideshow.min.js"></script>
  32. <script>
  33. var opts = {
  34. selector: ".bss-slides",
  35. auto: {
  36. // speed to advance slides at. accepts number of milliseconds
  37. speed : 6000,
  38. // pause advancing on mouseover? accepts boolean
  39. pauseOnHover : false
  40. },
  41. // show fullscreen toggle? accepts boolean
  42. fullScreen : true
  43. };
  44. makeBSS('.bss-slides', opts);
  45. </script>
  46. </body>
  47. </html>