โฮมเพจ » Toolkit - หน้า 12

    Toolkit - หน้า 12

    Lory Carousel Slider คุณสมบัติ CSS Animation & Touch Support
    ออกมาจากทั้งหมด ปลั๊กอินม้าหมุนออนไลน์ ฉันต้องทิปหมวกให้ ลอรี่. มันช่างเป็น แนวคิดที่เรียบง่าย แต่มันเป็นหนึ่งใน แถบเลื่อนที่ทรงพลังที่สุด บนเว็บ. เวอร์ชันย่อ รวมประมาณ 7KB ซึ่งไม่เล็ก แต่ก็แน่นอน ไม่เลวสำหรับแถบเลื่อนแบบเปิดใช้งานด้วยการสัมผัส. คุณสามารถเพิ่มปลั๊กอินนี้ลงในเว็บไซต์ใด ๆ ก็ได้ รันบน jQuery หรือธรรมดาวานิลลา JS. มันสามารถวิ่งได้ด้วย ไม่มีการพึ่งพา ซึ่งเหมาะสำหรับความเข้ากันได้. ลอรี่เป็นหนึ่งในปลั๊กอินไม่กี่ตัวที่ ไม่ลดระดับลงในเบราว์เซอร์รุ่นเก่า. มัน สนับสนุนอย่างเต็มที่ใน IE10+,...
    เรียนรู้ทฤษฎีสีเชิงปฏิบัติด้วย Web App นี้
    ในขณะที่หัวเรื่องของทฤษฎีสีอาจดูเหมือนพื้นฐาน แต่ไม่ใช่สิ่งที่คุณสามารถเข้าใจได้โดยการอ่าน เพื่อให้เข้าใจทฤษฎีสีอย่างแท้จริงคุณจำเป็นต้องฝึกปฏิบัติ. หากคุณกำลังสร้างโครงการบนเว็บบ่อยครั้งดังนั้นการใช้สีจึงเป็นสิ่งจำเป็น ทฤษฎีสีจริง แอพพลิเคชั่นที่มีประโยชน์ที่จะช่วยให้คุณเรียนรู้เกี่ยวกับสีได้อย่างรวดเร็ว. แอปพลิเคชั่นฟรีนี้มีวัตถุประสงค์เพื่อนักพัฒนาซอฟต์แวร์ที่ไม่ทราบเรื่องสีการออกแบบหรือความสวยงามของ UI. สิ่งทั้งหมดนั้นถูกสร้างขึ้นจริงและเผยแพร่ใน GitHub โดยนักออกแบบและผู้เขียนโค้ด Natalya Shelburne. ตอนนี้เธอทำงานเป็นผู้พัฒนาส่วนหน้า แต่เธอมีประสบการณ์มากกว่า 6 ปีในการสอนศิลปะและการออกแบบ Natalya เป็นค็อกเทลที่สมบูรณ์แบบของการออกแบบและประสบการณ์การพัฒนาทรัพยากรสีนี้! ในขณะที่คุณทำงานผ่านเว็บไซต์คุณจะ เรียนรู้ว่าทำไมสีบางสีจึงไม่ตรงกัน, ในขณะที่คนอื่นทำ นอกจากนี้โทนสีบางอย่างมักดูไม่ชำนาญและง่ายต่อการหลีกเลี่ยงเมื่อคุณเข้าใจกฎสำคัญบางอย่าง. ตัวอย่างเช่นฉันมักจะออกแบบตามกฎที่จะไม่ใช้สีดำและมันทำหน้าที่ฉันดี สีเดียวกันอาจเป็นจริงสำหรับสีที่เข้มอื่น ๆ หลีกเลี่ยงการใช้สีที่บริสุทธิ์ทุกครั้งที่เป็นไปได้ (เช่นหลีกเลี่ยงสีฟ้าเต็มเช่น # 0000FF)....
    เรียนรู้วิธีการทำงานของคุณสมบัติ CSS Grid กับ Griddy.io
    หากคุณติดตามเทคโนโลยีการออกแบบเว็บคุณควรรู้เกี่ยวกับ CSS กริด คุณสมบัติเหล่านี้คือ เพิ่มใหม่ในรูปแบบ CSS3 และพวกเขากลายเป็นเพื่อนที่ดีที่สุดของนักพัฒนาอย่างรวดเร็ว. เมื่อเร็ว ๆ นี้เราได้กล่าวถึงเกมสนุก ๆ เพื่อช่วยให้คุณเรียนรู้คุณสมบัติของกริด CSS แต่เกมไม่ได้สอนแนวความคิดในทางปฏิบัติเสมอไป นั่นคือสิ่งที่ Griddy อาจมีประโยชน์มากกว่า. เว็บแอปฟรีนี้ให้คุณ กำหนดกริดในเวลาจริงและอัปเดตตัวอย่างสด บนหน้า คุณสามารถยุ่งกับกริดที่กำหนดเองของคุณเองโดยการกำหนดคอลัมน์รางและระยะขอบและปรับโครงสร้างหน้าใหม่เพื่อเรียนรู้วิธีการทำงานของคุณสมบัติกริด. Griddy เป็นจริง เครื่องมือการเรียนรู้ฟรีที่สร้างขึ้นสำหรับนักพัฒนาส่วนหน้า ผู้ที่ต้องการทำความเข้าใจเพิ่มเติมเกี่ยวกับกริด CSS. ด้วยเว็บแอพนี้คุณสามารถเพิ่มไอเท็มใหม่ ๆ ลงในกริดลบไอเทมอื่น ๆ...
    เรียนรู้ Adobe XD ฟรีด้วยคู่มือเว็บนี้
    หากคุณวางแผนที่จะเรียนรู้ ซอฟต์แวร์ UI / UX ใหม่ล่าสุดของ Adobe จากนั้นให้ระวังว่าคุณจะอยู่ในช่วงการเรียนรู้ค่อนข้างมากเพราะ Adobe XD เป็นเครื่องมือออกแบบที่ซับซ้อนจริงๆ อย่างไรก็ตามหากคุณต้องการติดตามกระบวนการเรียนรู้อย่างรวดเร็วให้ดูที่คู่มือนี้เผยแพร่โดย XD Guru. มันใหญ่ที่สุดและ คู่มือที่ครอบคลุมที่สุดเกี่ยวกับซอฟต์แวร์ Adobe XD ที่คุณจะพบออนไลน์ มันสอนอินเทอร์เฟซเครื่องมือและแม้แต่เวิร์กโฟลว์พื้นฐานบางอย่างสำหรับนักออกแบบโดยไม่เสียค่าใช้จ่าย! สิ่งที่ดีเกี่ยวกับคำแนะนำนี้คือคุณสามารถเริ่มต้นได้โดยไม่มีประสบการณ์ มันจะแนะนำคุณตลอดกระบวนการทีละขั้นตอนสำหรับการเรียนรู้วิธีการทำงานของ Adobe XD และวิธีการที่เหมาะกับเวิร์กโฟลว์ทั่วไป. ที่ด้านซ้ายของหน้าคุณจะพบสารบัญ ใช้ลิงค์เหล่านี้เพื่อ ข้ามไปที่หัวข้อที่คุณต้องการเรียนรู้. ผู้เริ่มต้นอาจข้ามไปยังหัวข้อต่างๆเช่นการพิมพ์หรือกำหนดรูปร่างใน Adobe...
    Leaflet.js เป็นห้องสมุดแผนที่ที่ง่ายที่สุดที่คุณเคยพบ
    Google Maps เป็นที่นิยมมากที่สุด วิดเจ็ตแผนที่แบบฝังได้ สำหรับนักออกแบบเว็บไซต์ แต่สิ่งที่เกี่ยวกับ การเพิ่มคุณสมบัติที่กำหนดเอง เช่นคำแนะนำเครื่องมือและเครื่องหมายหมุด? ที่นี่เป็นที่ ๆ มีห้องสมุดที่ยอดเยี่ยม Leaflet.js ช่วยตัน. มันคือ โครงการโอเพ่นซอร์สที่สมบูรณ์ฟรี เริ่มสร้างโดยหนึ่งในพวกที่ Mapbox ชื่อว่า Vladimir Agafonkin ตั้งแต่นั้นเป็นต้นมาแผ่นพับได้ขยายรวม ผู้มีส่วนร่วมหลายสิบคน รอบโลก. บ่อยครั้ง อัปเดตพร้อมการแก้ไขข้อบกพร่องและคุณสมบัติใหม่ ที่ปรับปรุงการใช้งานโดยรวมในเว็บไซต์ใด ๆ นี่คือห้องสมุดทำแผนที่ที่ฉันชอบที่สุดเนื่องจากความแข็งแรงและความสวยงามของการออกแบบ. มันมีคุณสมบัติมากมายที่ฉันไม่สามารถแสดงได้ทั้งหมด แต่นี่คือ...
    Kernel.css - เฟรมเวิร์กส่วนหน้าแบบเบาความหมายและไม่เป็นอันตราย
    นักพัฒนาทราบถึงความเจ็บปวดของ สร้างรหัสใหม่จากศูนย์. โชคดีที่ชุมชนการพัฒนาเว็บนำเสนอสิ่งต่างๆมากมายในแบบโอเพ่นซอร์สและเฟรมเวิร์กส่วนหน้า. เฟรมเวิร์กยอดนิยมเช่น Bootstrap ทำงานได้ดี แต่ยังสามารถ รู้สึกป่องเกินไป. โชคดีที่มีทางเลือกและหนึ่งในรายการโปรดใหม่ล่าสุดของฉันคือ Kernel.css. เคอร์เนลเรียกตัวเองว่า กรอบที่ไม่ล่วงล้ำ, ความหมายมันจะ ทำงานเหมือนชั้นบาง ๆ ด้านบนของหน้า ไม่รู้สึกยุ่งยากหรือยากที่จะปรับแต่งและชั้นเรียนมี สอดคล้องกับข้อกำหนด HTML5 ที่ทันสมัยอย่างสมบูรณ์. งานของนักพัฒนาส่วนหน้าควร ปฏิบัติตามความหมายที่เหมาะสม สำหรับการเข้าถึงและการรองรับเบราว์เซอร์ระดับสูงสุด การใช้เฟรมเวิร์กเช่นเคอร์เนลช่วยประหยัดเวลาและความยุ่งยากในการแก้ไขปัญหาทั่วไป. นี่คือบางส่วนที่ขายดีที่สุดของเคอร์เนล: ระบบกริดของมัน ทำงานบน flexbox. ตอบสนองอย่างเต็มที่ และ...
    ไลบรารี JavaScript สำหรับเอฟเฟกต์การเลื่อนแบบเย็น
    การออกแบบเว็บไซต์กลับมามีชีวิตชีวาด้วยแอนิเมชั่นที่ทำงานได้ดี หากคุณกำลังมองหาไลบรารี่ที่เหมาะสมเพื่อเพิ่มเอฟเฟกต์ให้กับโครงการของคุณที่นี่ฉันได้ทำรายการไลบรารี่บางส่วนที่ คุณสามารถใช้เพื่อให้ผลตามเหตุการณ์เลื่อน. เมื่อผู้ใช้เลื่อนหน้าเว็บลงการกระทำ สามารถออกแบบมาเพื่อทริกเกอร์ตัวเลือกภาพเคลื่อนไหวที่หลากหลาย เช่นเอฟเฟกต์จาง, เบลอ, 3D, พารัลแลกซ์และอื่น ๆ ที่นี่มี 25 ไลบรารี JS ที่สามารถช่วยให้คุณบรรลุการตอบสนองในการออกแบบเว็บไซต์ของคุณ. เลื่อนเปิดเผย ไลบรารีที่ทำให้การเพิ่มแอนิเมชั่นการเลื่อนสำหรับเว็บและมือถือเป็นเรื่องง่าย คุณสามารถตั้งค่าการทำให้ผ่อนคลายแบบกำหนดเองการหมุน 3D ระยะเวลาและพารามิเตอร์ mor จำนวนมากเป็นองค์ประกอบที่คุณต้องการทำให้เคลื่อนไหว. อ้างอิง: ไม่มี | ขนาด: 2.9kb | ใบอนุญาต: เอ็มไอที...
    ไอคอน JAM - Iconfont พร้อมไอคอนฟรีกว่า 800 แบบสำหรับเว็บไซต์ของคุณ
    นักออกแบบเว็บไซต์จะเลือกครอกด้วยชุดไอคอน คุณสามารถหาของฟรีนับร้อยได้ทางออนไลน์และส่วนใหญ่มีไว้สำหรับใช้ในเชิงพาณิชย์. ฉันมักจะมองหาชุดไอคอนใหม่และชุดล่าสุดที่ฉันพบคือไอคอนแยม อันนี้ยอดเยี่ยม ชุดไอคอนมีการวนซ้ำสองสามครั้ง ขณะนี้กำลังนั่งอยู่ที่ v1.0.7 ด้วยการอัปเดตแบบกึ่งบ่อย. แพ็คทั้งหมดนี้คือ ฟรีและโอเพนซอร์ส - สามารถดาวน์โหลดได้บน GitHub รวมถึงไฟล์ SVG แต่สิ่งที่คุณต้องการจริงๆสำหรับไซต์ของคุณคือโฟลเดอร์แบบอักษรบนเว็บซึ่งสามารถฝังลงใน CSS ได้โดยตรง. คุณยังสามารถใช้ไอคอน SVG ได้โดยตรงในหน้าของคุณหากคุณรู้วิธี เบราว์เซอร์ที่ทันสมัยส่วนใหญ่รองรับสิ่งนี้! แต่เดิม JAM ได้รับการออกแบบให้เป็นชุดไอคอนที่ไม่ซ้ำใคร. สไตล์ไอคอนเส้นเป็นที่นิยมสวย และง่ายต่อการผสมผสานในหน้าใด ๆ. บวกกับแต่ละไอคอนได้รับการออกแบบในตารางดังนั้นมันค่อนข้างง่ายที่จะแก้ไข ไอคอนทั้งหมดเหล่านี้จะผสมผสานกันอย่างลงตัวในรูปแบบที่กริดและสัดส่วนเป็นกุญแจสำคัญ....