圆滑的传送带无法处理自举弹出窗口,将如何解决该问题。尽管圆滑的传送带可以在引导弹出窗口之外使用。这是小提琴https://jsfiddle.net/dskgsaat/
<style>
.slider-car{ display:none;}
</style>
<div class="container"><h3>Popover Example</h3>
<a href="#" id ="pop" data-toggle="popover" title="Popover Header" data-container="body" data-placement="bottom" type="button" data-html="true">Toggle popover</a>
</div>
<div class="col-sm-4 slider-car">
<div class="cd-hero-slider " id="elem-flav">
<div id="section-a"> <img src="Flavor.png" alt="..."> </div>
<div id="section-b"> <img src="Flavor-2.png" alt="..."> </div>
<div id="section-c"> <img src="Flavor-3.png" alt="..."> </div>
</div>
</div>
<script type="text/javascript">
$(document).ready(function(){
$('[data-toggle="popover"]').popover({
html: true,
content: function() {
return $('.slider-car').html();
},
template: '<div class="popover my-popover" role="tooltip"><div class="arrow"></div><div class="popover-content"></div></div>'
});
$('.cd-hero-slider').slick({
slidesToShow: 1,
slidesToScroll: 1,
autoplay: true,
autoplaySpeed: 2000,
dots: true,
arrows: false
});
$('.cd-hero-slider').resize()
});
$("#pop").click(function(){
$("p").show('.slider-car');
});
</script>
最佳答案
如果doesn't get initialized
,则滑动滑块parent division is hidden
。附加click function to popover
完成了这项工作。
$('[data-toggle="popover"]').popover({
html: true,
content: function() {
return $('.slider-car').html();
},
template: '<div class="popover my-popover" role="tooltip"><div class="arrow"></div><div class="popover-content"></div></div>'
}).click(function() {
$('.cd-hero-slider').slick({
slidesToShow: 1,
slidesToScroll: 1,
autoplay: true,
autoplaySpeed: 500,
dots: false,
arrows: true,
centerMode:true,
infinite:true
});
});
工作提琴https://jsfiddle.net/dskgsaat/13/