คำถามติดแท็ก twitter-bootstrap

Bootstrap เป็นเฟรมเวิร์กเอนด์ที่ออกแบบมาเพื่อพัฒนาเว็บไซต์และแอพพลิเคชั่นบนเว็บ สำหรับคำถามที่เกี่ยวข้องกับเวอร์ชั่นของ Bootstrap ให้ใช้แท็กของเวอร์ชันเฉพาะจาก "twitter-bootstrap-2", "twitter-bootstrap-3" และ "bootstrap-4"

18
ฉันจะทำให้แท็บปัจจุบันใช้งานกับ twitter bootstrap ได้อย่างไรหลังจากโหลดหน้าใหม่
ฉันกำลังใช้แท็บกับ Twitter Bootstrap และต้องการเลือกแท็บเดียวกันหลังจากที่ผู้ใช้โพสต์ข้อมูลและรีโหลดเพจ วิธีนี้ทำได้อย่างไร? สายปัจจุบันของฉันไปที่ inti แท็บมีลักษณะดังนี้: <script type="text/javascript"> $(document).ready(function() { $('#profileTabs a:first').tab('show'); }); </script> แท็บของฉัน: <ul id="profileTabs" class="nav nav-tabs"> <li class="active"><a href="#profile" data-toggle="tab">Profile</a></li> <li><a href="#about" data-toggle="tab">About Me</a></li> <li><a href="#match" data-toggle="tab">My Match</a></li> </ul>
21
Bootstrap ปิดเมนูตอบสนอง "เมื่อคลิก"
ใน "PRODUCTS" ให้คลิกฉันเลื่อน div สีขาวขึ้น (ตามที่เห็นในเอกสารแนบ) เมื่อตอบสนอง (มือถือและแท็บเล็ต) ฉันต้องการปิดแถบนำทางที่ตอบสนองโดยอัตโนมัติและแสดงเฉพาะแถบสีขาวเท่านั้น ฉันเหนื่อย: $('.btn-navbar').click(); ยังพยายาม: $('.nav-collapse').toggle(); และมันได้ผล อย่างไรก็ตามในขนาดเดสก์ท็อปมันถูกเรียกและทำอะไรบางอย่างกับเมนูที่ดูขี้ขลาดซึ่งมันจะหดตัวลงหนึ่งวินาที ความคิดใด ๆ ?
27
Bootstrap modal: ปิดปัจจุบันเปิดใหม่
ฉันมองหามาระยะหนึ่งแล้ว แต่ไม่พบวิธีแก้ปัญหานี้ ฉันต้องการสิ่งต่อไปนี้: เปิด URL ภายในโมดอล Bootstrap ฉันมีงานนอกหลักสูตรนี้ ดังนั้นเนื้อหาจึงถูกโหลดแบบไดนามิก เมื่อผู้ใช้กดปุ่มภายในโมดอลนี้ฉันต้องการให้โมดอลปัจจุบันซ่อนอยู่และหลังจากนั้นฉันต้องการให้โมดอลใหม่เปิดขึ้นพร้อมกับ URL ใหม่ (ซึ่งผู้ใช้คลิก) เนื้อหาของโมดอลที่ 2 นี้ยังโหลดแบบไดนามิก หากผู้ใช้ปิดโมดอลที่ 2 นั้นโมดอลแรกจะต้องกลับมาอีกครั้ง ฉันจ้องมองเรื่องนี้มาหลายวันแล้วหวังว่าจะมีคนช่วยฉันได้ ขอบคุณล่วงหน้า.
7
เปิดรายการแบบเลื่อนลง Bootstrap เมื่อคลิก
ฉันใช้รายการแบบเลื่อนลง bootstrap เป็น shoppingcart ในตะกร้าสินค้ามีปุ่ม "ลบสินค้า" (ลิงก์) ถ้าฉันคลิกที่มันสคริปต์ shoppingcart ของฉันจะลบผลิตภัณฑ์ออก แต่เมนูจะหายไป มีวิธีป้องกันปัญหานี้หรือไม่? ฉันลองใช้ e.startPropagation แล้ว แต่ดูเหมือนจะไม่ได้ผล: <div id="shoppingcart" class="nav-collapse cart-collapse"> <ul class="nav pull-right"> <li class="dropdown open"> <a href="#" data-toggle="dropdown" class="dropdown-toggle">Totaal: € 43,00</a> <ul class="dropdown-menu"> <li class="nav-header">Pakketten</li> <li> <span class="quantity">1x</span> <span class="product-name">Test Product </span> <span class="product-remove"><a class="removefromcart" packageid="4" href="#">x</a> </span></li> <li><a …
6
การทำความเข้าใจคลาสกริด (col-sm- # และ col-lg- #) ใน Bootstrap 3
ฉันเริ่มต้นใช้งาน Bootstrap 3 และฉันมีปัญหาในการทำความเข้าใจว่าคลาสกริดมีไว้เพื่อใช้อย่างไร นี่คือสิ่งที่ฉันคิดได้จนถึงตอนนี้: ดูเหมือนว่าคลาสcol-sm-#และcol-lg-#แตกต่างจากคลาสเก่าทั่วไปตรงcol-#ที่จะใช้เฉพาะเมื่อหน้าจอมีขนาดใหญ่กว่าที่กำหนด (768px และ 992px ตามลำดับ) หากคุณละเว้น -sm- หรือ -lg- divs จะไม่ยุบรวมเป็นคอลัมน์เดียว แต่เมื่อฉันสร้างสอง divs ภายในแถวที่มีทั้งcol-sm-6ดูเหมือนว่าพวกเขาเป็นเพียงเคียงข้างเมื่อหน้าต่างอยู่ระหว่าง 768px และ 992px กว้าง ในคำอื่น ๆ ถ้าผมหดหน้าต่างตลอดทางลงแล้วค่อยๆขยายมันรูปแบบคอลัมน์เดียวแล้วสองคอลัมน์แล้วกลับไปที่คอลัมน์เดียวอีกครั้ง นี่เป็นพฤติกรรมที่ตั้งใจไว้หรือไม่? ถ้าฉันต้องการสองคอลัมน์สำหรับสิ่งที่เกิน 768px ฉันควรใช้ทั้งสองคลาสหรือไม่ ( <div class="col-sm-6 col-lg-6">) ควรcol-6 นอกจากนี้ยังจะรวม?<div class="col-6 col-sm-6 col-lg-6">
8
วิธีลบคุณสมบัติตอบสนองใน Twitter Bootstrap 3
เนื่องจาก Bootstrap 3 ไม่มีไฟล์แยกต่างหากสำหรับสไตล์ชีตที่ตอบสนองและมาตรฐานอีกต่อไป ดังนั้นฉันจะลบคุณสมบัติที่ตอบสนองได้อย่างง่ายดายได้อย่างไร
8
Bootstrap 3.0 Popovers และคำแนะนำเครื่องมือ
ฉันเพิ่งเริ่มใช้ Bootstrap และฉันมีปัญหาในการทำให้ฟีเจอร์ป๊อปโอเวอร์และคำแนะนำเครื่องมือใช้งานได้ ฉันไม่มีปัญหากับดรอปดาวน์และโมเดล แต่ดูเหมือนว่าฉันจะขาดบางอย่างสำหรับป๊อปโอเวอร์และคำแนะนำเครื่องมือ ฉันได้รับคำแนะนำเครื่องมือเพื่อแสดง แต่ไม่ได้มีสไตล์และอยู่เหมือนตัวอย่าง bootstrap และป๊อปโอเวอร์ไม่ทำงานเลย โปรดตรวจสอบและแจ้งให้เราทราบว่าฉันขาดอะไร <!DOCTYPE html> <html> <head> <title>Bootstrap 101 Template</title> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- Bootstrap --> <link href="css/bootstrap.min.css" rel="stylesheet" media="screen"> <link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.min.css" rel="stylesheet" media="screen"> <link href="css/font-awesome.min.css" rel="stylesheet" media="screen"> <link href="css/index.css" rel="stylesheet" media="screen"> <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements …
9
จะจัดกึ่งกลาง div ด้วย Bootstrap2 ได้อย่างไร?
http://twitter.github.com/bootstrap/scaffolding.html ฉันลองเหมือนชุดค่าผสมทั้งหมด: <div class="row"> <div class="span7 offset5"> box </div> </div> หรือ <div class="container"> <div class="row"> <div class="span7 offset5"> box </div> </div> </div> เปลี่ยนช่วงและตัวเลขชดเชย ... แต่ฉันไม่สามารถเอากล่องธรรมดาที่อยู่ตรงกลางหน้าได้อย่างสมบูรณ์แบบ :( ฉันแค่ต้องการกล่องกว้าง 6 คอลัมน์ที่อยู่ตรงกลาง ... แก้ไข: ทำกับ <div class="container"> <div class="row" id="login-container"> <div class="span8 offset2"> box </div> </div> </div> แต่กล่องกว้างเกินไปมีวิธีใดบ้างที่ฉันสามารถทำได้ด้วย span7? span7 offset2เพิ่มช่องว่างภายในช่องว่างด้านซ้ายspan7 offset3เพิ่มเติมทางด้านขวา ...
4
การจัดการตารางที่ตอบสนองใน Twitter Bootstrap
เมื่อความกว้างของตารางเกินความกว้างของสแปนเช่นหน้านี้: http://jsfiddle.net/rcHdC/ คุณจะเห็นเนื้อหาของตารางอยู่นอกไฟล์span. อะไรคือวิธีที่ดีที่สุดในการตอบสนองกรณีนี้?
16
วิธีใช้ Twitter Bootstrap popovers สำหรับการแจ้งเตือนการตรวจสอบความถูกต้อง jQuery
ฉันสามารถทำให้ป๊อปโอเวอร์ปรากฏขึ้นโดยใช้bootstrapได้ง่ายพอและฉันยังสามารถทำการตรวจสอบความถูกต้องโดยใช้ปลั๊กอินตรวจสอบความถูกต้อง jQueryมาตรฐานหรือเครื่องมือตรวจสอบความถูกต้อง jQueryแต่ฉันไม่สามารถหาวิธีป้อนข้อมูลลงในอีกรายการหนึ่งได้ ฉันคิดว่าสิ่งที่ฉันต้องการคือ hook ที่ถูกเรียกโดย validator เมื่อต้องการแสดงการแจ้งเตือนให้ปิดการส่งข้อความและองค์ประกอบเป้าหมายไปยัง popover ดูเหมือนว่าเป็นการฉีดยาแบบพึ่งพา ทุกอย่างดีในทางทฤษฎี แต่ฉันคิดไม่ออกว่าตะขอนั้นอยู่ที่ไหนหรือแม้ว่าจะมีอยู่ในเครื่องมือตรวจสอบความถูกต้องก็ตาม ทั้งคู่ดูเหมือนตั้งใจที่จะรับผิดชอบในการแสดงการแจ้งเตือนด้วยตัวเลือกที่ซับซ้อนทุกประเภทสำหรับการจัดวางการห่อหุ้มรูปแบบเมื่อสิ่งที่ฉันตามมาคือประเภทข้อผิดพลาด (ฉันไม่จำเป็นต้องใช้ข้อความ) และองค์ประกอบที่เกี่ยวข้อง ถึง. ฉันพบตะขอสำหรับทั้งแบบฟอร์มไม่ใช่การแจ้งเตือนแต่ละรายการ ฉันชอบระบบตรวจสอบความถูกต้องที่ใช้คลาสเพื่อกำหนดกฎมากกว่าเนื่องจากพวกเขาเล่นได้ดีกับรูปแบบที่สร้างขึ้นแบบไดนามิก ใครมีวิธีแก้ปัญหาหรือแนวคิดที่ดีกว่านี้
10
ทวิตเตอร์ bootstrap โมดอลเลื่อนได้
ฉันใช้ twitter bootstrap สำหรับโปรเจ็กต์ที่ฉันกำลังทำอยู่ ฉันมีหน้าต่างโมดอลที่มีรูปแบบค่อนข้างยาวกว่าและฉันไม่ชอบเมื่อหน้าต่างมีขนาดเล็กเกินไปโมดอลจะไม่เลื่อน (ถ้าเพิ่งหายไปจากหน้าของฉันซึ่งไม่สามารถเลื่อนได้) ในการแก้ไขปัญหานี้ฉันใช้ css ต่อไปนี้ .modal { overflow-y:auto; max-height:90%; margin-top:-45%; } วิธีนี้ใช้งานได้ตามที่ฉันต้องการใน Chrome (นั่นคือแบบฟอร์มเป็นขนาดเต็มเมื่อหน้าต่างมีขนาดใหญ่พอ แต่เมื่อหน้าต่างหดตัวโมดอลจะหดตัวและเลื่อนได้) ปัญหาคือใน IE โมดอลปิดหน้าจอ ใครมีวิธีแก้ปัญหาที่ดีกว่านี้บ้าง? ตัวอย่างของฉันสามารถพบได้ที่ tinyhousemap.com (คลิก 'เพิ่มรายการลงในแผนที่' ในหน้าต่างนำทางเพื่อให้โมดอลปรากฏขึ้น) ขอบคุณ
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.