1

モーダル内にカルーセルがあります...カルーセルは画像を循環しますが、そこにビデオがあるため、ビデオに到達するとサイズが変わります。
ただし、モーダル/カルーセルが画像からビデオに到達すると (その逆)、サイズ変更がひどく不格好になります。サイズ間のスムーズな移行を希望します。これはさまざまなサイズで機能する必要があるため、ピクセル単位でサイズを定義することはできません。

<div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">

                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
                    <h3 id="myModalLabel">So, Why Are We The Best?</h3>
                </div>
                <div class="modal-body">
                    <div id="myCarousel" class="carousel slide carousel-fade">
                        <!-- Carousel items -->
                        <div class="carousel-inner">
                        <div class="active item">
                            <div class="video">
                                <iframe src="https://www.facebook.com/video/embed?video_id=640177702674225"></iframe>
                                </div>
                                <hr></hr>
                                <p>Description</p>
                            </div>
                            <div class="item">
                                <img src="img/Comp_1.jpg">
                                <hr></hr>
                                <p>Description</p>
                            </div>
                            <div class="item">
                                <img src="img/Comp_2.jpg">
                                <hr></hr>
                                <p>Description</p>
                            </div>
                            <div class="item">
                                <img src="img/Comp_3.jpg">
                                <hr></hr>
                                <p>Description</p>
                            </div>

                        </div>
                        <!-- Carousel nav -->
                        <a class="carousel-control left" href="#myCarousel" data-slide="prev">&lsaquo;</a>
                        <a class="carousel-control right" href="#myCarousel" data-slide="next">&rsaquo;</a>
                    </div>


                </div>
            </div>
4

1 に答える 1

0

このbootstrap-modal-carouselを確認してください。これは役立つかもしれません

于 2014-01-09T14:51:02.383 に答える