1. การวิเคราะห์การนำทาง (NAV)
ไฟล์ซอร์สโค้ด:
_navs.scss: โมดูลนำทาง
mixins/_nav--vidider.scss: Divider Line
mixins/_nav-vertical-align.scss: การจัดแนวแนวตั้ง
1. มันเป็นเพียงสไตล์ด้วย CSS และไม่ต้องพึ่งพา JS
2. โมดูลการนำทางอาจรวมโมดูลแบบดึงลง
3. ตระหนักถึงการกระจายแนวนอนแนวตั้ง, แนวนอนเท่ากัน (การใช้งานตารางเซลล์, การกำจัด 4.0), แท็บ, แคปซูลและสไตล์อื่น ๆ
4. Navid Divider: มีความสูงของพิกเซลที่จะตระหนักถึงเส้นแบ่ง
5. Nav-Stacked: การจัดตำแหน่งแนวตั้ง
6. จัดเตรียมคลาสเนื้อหาแท็บเพื่อห่อแท็บจากนั้นใช้แท็บ-เพนเป็นพื้นที่เนื้อหาสำหรับส่วนขยายหน้าแท็บ
7. แบบเลื่อนลงภายใต้ NAV-Tabs ได้รับการประมวลผลเพื่อลดขนาดพิกเซลขึ้นไปหนึ่งพิกเซลเนื่องจาก NAV-TABS จะมีบรรทัดล่างและไม่หดพิกเซลขึ้นไปหนึ่งพิกเซลขึ้นไปและจะมีช่องว่างว่างเปล่า
// เฉพาะ dropdowns.nav-tabs .dropdown-menu {// ทำแท็บซ้อนทับชายแดนแบบเลื่อนลงมาก่อนขอบด้านบน: -1px; // ลบมุมโค้งมนด้านบนที่นี่เนื่องจากมีขอบแข็งเหนือเมนู @include border-top-radius (0);}2. เอฟเฟกต์การล่มสลาย
ไฟล์ซอร์สโค้ด:
MixIns/_component-animations.scss: การยุบการใช้งานเพื่อให้ได้เอฟเฟกต์การพับ
JavaScripts/bootstrap/collapse.js: การยุบเอฟเฟกต์การใช้งาน
1. $ this.data () รวบรวมข้อมูลทั้งหมด-* ข้อมูล
2. คุณสมบัติหลัก: ระบุว่าการล่มสลายในปัจจุบันถูกควบคุมโดยผู้ปกครองซึ่งส่วนใหญ่ตระหนักถึงผลกระทบของการควบคุมหนึ่งครั้งและอีกมากมาย ต่อไปนี้เป็นรหัสของการซ่อนรายการเด็กทั้งหมดภายใต้พาเรนต์เดียวกัน:
return $ (this.options.parent) .find ('[data-toggle = "การล่มสลาย"] [data-parent = "' + this.options.parent + '"]') .Each ($. proxy (ฟังก์ชั่น (i, element) {var $ element = $ (องค์ประกอบ) สิ่งนี้3. การดำเนินการของ PRAENT ยังต้องมีการรวมเข้าด้วยกันของคลาส. แพนเนลเพราะเมื่อค้นหาเชื่อว่ามีการวางย่อยทั้งหมดอยู่ภายใต้คลาส. แพนเนล
4. วิธีการสิ้นสุดของ jQuery (): สิ้นสุดห่วงโซ่ตัวกรองปัจจุบันและคืนค่าองค์ประกอบการจับคู่ที่ตั้งค่าเป็นสถานะก่อนหน้า (ตำแหน่งที่ห่วงโซ่เริ่มต้น)
$ ("P") ค้นหา ('. bak') ค้นหา ('span'). end (): คืนค่าเป็น $ ("p")
5. Scrollheight: ความสูงของหน้า (รับความสูง/ความกว้างจริงที่จะขยาย) ประกอบด้วยส่วนที่มองไม่เห็นของหน้าต่างซึ่งใช้ในการล่มสลายเพื่อระบุค่าสูงสุดที่จะขยายและความสูง/widht จะถูกล้างหลังจากการเคลื่อนไหวเสร็จสมบูรณ์
var scrollsize = $ .camelcase (['Scroll', Dimension] .oin ('-')) สิ่งนี้ $ element. one ('bstransitionend', $ .proxy6. องค์ประกอบการประมวลผลแบ่งออกเป็นสองประเภท: หนึ่งคือการขยายหรือซ่อนองค์ประกอบเอง ($ องค์ประกอบ) และอื่น ๆ คือการสัมผัสปุ่มเพื่อพัฒนาหรือซ่อนองค์ประกอบ ($ trigger)
7. ในวิธี Hiden ความสูงของพื้นที่พับจะถูกวาดใหม่และจากนั้นจะได้รับความสูงของพื้นที่จริง:
สิ่งนี้. $ Element [DIMENSION] (นี่คือ $ element [DIMENSION] ()) [0] .OffSetheigh
8. ทริกเกอร์ของวิธี Hiden ถูกทริกเกอร์โดยค่าเริ่มต้นผ่านการตัดสินในวิธีการแสดง:
if (actives && activeS.length) {plugin.call (actives, 'ซ่อน') ActiveSdata || activeS.data ('bs.collapse', null)}ข้างต้นเป็นเรื่องเกี่ยวกับบทความนี้ฉันหวังว่ามันจะเป็นประโยชน์สำหรับทุกคนในการเรียนรู้การเขียนโปรแกรม JavaScript