<!doctype html>
|
|
<html>
|
|
<head>
|
|
<title>Spy30 Slideshow</title>
|
|
<link rel="stylesheet" href="/slideshow/css/simple-slideshow-styles.css">
|
|
<meta http-equiv="refresh" content="300;url=/slideshow" />
|
|
<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>
|