Bootstrap modal ค้างหน้า

ฉันค้นหาคำตอบในเว็บนี้โดยมีคำถามนี้ใกล้เคียงกับของฉันมากที่สุด Bootstrap Modal โผล่ขึ้นมาแต่มีสีจาง หน้าและไม่สามารถโต้ตอบได้

ฉันกำลังสร้างหน้าผู้ดูแลระบบด้วย bootstrap และฉันใช้ modals ในนั้น จัดแต่งทรงผมด้วยธีม Bootswatch เมื่อใช้บางธีม เมื่อเปิดโมดอล โมดอลจะปรากฏในหน้าสีและทุกอย่างจะหยุดนิ่ง ฉันต้องรีเฟรชหน้าเพื่อกำจัดมันอีกครั้ง

ฉันได้ลองย้ายโมดอลไปที่ด้านล่างของหน้า ก่อนแท็กปิด </body>
ไม่มีอะไรทำงาน!

สิ่งที่แปลกก็คือด้วย bootstrap css "พื้นฐาน" ก็มีปัญหาเดียวกัน มีธีม Bootswatch บางธีมที่ทำงานอย่างที่ควรจะเป็น และบางธีมก็ทำให้เกิดปัญหานี้

ฉันทำและเป็นตัวอย่างใน jsFiddle ที่นี่: http://jsfiddle.net/qyo53dxh/ อันนี้อยู่กับ ธีม "กระดาษ" จาก bootswatch เมื่อใช้ธีม "ยูไนเต็ด" มันทำงานได้ตามปกติ

เกิดอะไรขึ้น?


person Ivar Kramer    schedule 04.12.2014    source แหล่งที่มา
comment
เป็นการยากที่จะแยกปัญหาเฉพาะเจาะจงโดยไม่มีตัวอย่างโค้ดที่กำหนดเป้าหมาย ซอที่ใช้งานได้แสดงให้เราเห็นเพียงเล็กน้อย เนื่องจากไม่อนุญาตให้ระบุปัญหาได้ เลือกธีมที่ไม่ทำงาน ระบุโค้ดที่จำเป็นน้อยที่สุดในการจำลอง และอาจให้ตัวอย่างด้วย ถ้าไม่มีมันก็เป็นอะไรก็ได้ :S   -  person SW4    schedule 04.12.2014


คำตอบ (1)


ในซอของคุณคุณกำลังนำเข้า bootstrap.css และ bootstrap.min.css?

โปรดลบ bootstrap.css

และทั้งหมดทำงานได้ดี

<div class="modal fade forget-modal" tabindex="-1" role="dialog" aria-labelledby="myForgetModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-sm">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">
                    <span aria-hidden="true">×</span>
                    <span class="sr-only">Sluiten</span>
                </button>
                <h4 class="modal-title">Wachtwoord resetten</h4>
            </div>
            <div class="modal-body">
                <p>Typ uw email adres</p>
                <input type="email" name="recovery-email" id="recovery-email" class="form-control" autocomplete="off">
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Annuleren</button>
                <button type="button" class="btn btn-custom">Herstellen</button>
            </div>
        </div> <!-- /.modal-content -->
    </div> <!-- /.modal-dialog -->
</div> <!-- /.modal -->

นี่คือการเล่นซอ http://jsfiddle.net/qyo53dxh/1/

person Miomir Dancevic    schedule 04.12.2014