Wie man Schieberegler in Modal-Box implementieren?

Question

Ich versuche, Slider innerhalb der modalen Box zu implementieren, aber das funktioniert nicht. Ich benutze Modal Box und versuche, Slider in der Modal Box zu implementieren.

Hier ist mein Code:

$("#lightSlider").lightSlider({ 
    auto:false,  
    adaptiveHeight: false,  
}); 

Slider nur kommt dann aus ich inspizieren Browser und Modal Box hält während inspizieren Element ihre Größe zu verändern.

Irgendeine Idee, warum das passiert oder muss ich meinen Slider ändern?

Answer 1

Verwenden Sie einfach einen carousal Schieber in Ihrem modalen Körper

<div id="myCarousel" class="carousel slide" data-ride="carousel"> 
<ol class="carousel-indicators"> 
<li data-target="#myCarousel" data-slide-to="0" class="active"></li> 
<li data-target="#myCarousel" data-slide-to="1"></li> 
<li data-target="#myCarousel" data-slide-to="2"></li> 
<li data-target="#myCarousel" data-slide-to="3"></li> 
</ol><div class="carousel-inner" role="listbox"> 
<div class="item active"> 
    <img src="img_chania.jpg" alt="Chania"> 
</div> 

<div class="item"> 
    <img src="img_chania2.jpg" alt="Chania"> 
</div> 

<div class="item"> 
    <img src="img_flower.jpg" alt="Flower"> 
</div> 

<div class="item"> 
    <img src="img_flower2.jpg" alt="Flower"> 
</div> 

<a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev"> 
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span> 
<span class="sr-only">Previous</span> 

<a class="right carousel-control" href="#myCarousel" role="button" data-slide="next"> 
<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span> 
<span class="sr-only">Next</span> 
    </a> 
</div>