Javascript Jquery滑块插件,一切正常,但图像不变
查询新手,我正在玩这个滑块插件,我让它手动工作,但当参数设置为“interval:true”和“intervalTime:100”时,它不会自动更改图片。为什么会这样 HTML JqueryJavascript Jquery滑块插件,一切正常,但图像不变,javascript,jquery,jquery-ui-slider,Javascript,Jquery,Jquery Ui Slider,查询新手,我正在玩这个滑块插件,我让它手动工作,但当参数设置为“interval:true”和“intervalTime:100”时,它不会自动更改图片。为什么会这样 HTML Jquery $(document).ready(function() { $('#rotatescroll').tinycircleslider({ interval: true, intervalTime: 100, dotsSnap: true }); }
$(document).ready(function()
{
$('#rotatescroll').tinycircleslider({ interval: true, intervalTime: 100, dotsSnap: true });
});
我试着下载并运行它,它运行正常。一定是你的css出了问题,有一把小提琴在那里工作-。我刚把你的照片移到那里。您的第一张图像有问题。
#rotatescroll { height:300px; position:relative; width:300px; }
#rotatescroll .viewport{ height:300px; position: relative; margin:0 auto; overflow:hidden; width:300px }
#rotatescroll .overview { position: absolute; width: 798px; list-style: none; margin: 0; padding: 0; left: 0; top: 0; }
#rotatescroll .overview li { height:300px; width:300px; float: left; position: relative; }
#rotatescroll .overlay {background:url(https://raw.githubusercontent.com/wieringen/tinycircleslider/master/examples/simple/images/bg-rotatescroll.png) no-repeat 0 0; pointer-events: none; position: absolute; left: 0; top: 0; height:300px; width:300px; }
#rotatescroll .thumb { background:url(https://raw.githubusercontent.com/wieringen/tinycircleslider/master/examples/simple/images/bg-thumb.png) no-repeat 50% 50%; position: absolute; top: -3px; cursor: pointer; left: 137px; width: 100px; z-index: 200; height: 100px; }
#rotatescroll .dot { background:url(https://raw.githubusercontent.com/wieringen/tinycircleslider/master/examples/simple/images/bg-dot.png) no-repeat 0 0; display: none; height: 12px; width: 12px; position: absolute; left: 155px; top: 3px; z-index: 100; }
#rotatescroll .dot span { display: none; }
$(document).ready(function()
{
$('#rotatescroll').tinycircleslider({ interval: true, intervalTime: 100, dotsSnap: true });
});