jQuery
【jQuery】フルウィンドウスライダープラグインFull window width content slider
January 14, 2017

Full window width content sliderはフルウィンドウスライダープラグイン。
<style> #slider{ width: 100%; height: 400px; overflow: hidden; position: relative; } #items{ width: 2000em; position: absolute; } #items > div{ float: left; } #items > div > div { width: 960px; margin: 0 auto; } </style> <script src="jquery.js"></script> <script src="scrollable.all.min.js"></script> <script>$('#slider').scrollable().fullwidth();</script> <div id="slider"> <div id="items"> <div> <div> <h1>Slide 1</h1> </div> </div> <div> <div> <h2>Slide 2</h2> </div> </div> <div> <div> <h3>Slide 3</h3> </div> </div> </div> </div>
$('#slider').scrollable({ circular: true, touch: false, easing: 'linear', speed: 400 }).navigator({ navi: '#navigation', history: true, idPrefix: 'slide_' }).autoscroll({ autoplay: true, autopause:true, interval: 5000 }).fullwidth({ width: 960 // If you need a static width });