Toolkit - หน้า 26

ของฟรี ปลั๊กอิน Offcanvas เป็นหนึ่งในแหล่งข้อมูลมากมายสำหรับการเลื่อนดูการนำทาง คุณสามารถค้นหาปลั๊กอินที่คล้ายกันออนไลน์ได้ แต่ Offcanvas มีความโดดเด่นด้วยเหตุผลบางประการ. มันคือ ห้องสมุดที่มีน้ำหนักเบาพอสมควร และในขณะที่มันทำงานบน jQuery ก็ยัง ไม่ยากที่จะตั้งค่า. สิ่งนี้เป็นจริงสำหรับทั้งรหัส JavaScript และรหัส HTML ดังนั้นคุณไม่จำเป็นต้องเปลี่ยนการนำทางเริ่มต้นของคุณเลย. ปลั๊กอิน Offcanvas ช่วยให้คุณ กำหนดบางพื้นที่ที่เมนูควรปรากฏขึ้น. โดยปกติแล้วนี่คือด้านซ้ายหรือขวาของหน้าจอ แต่คุณสามารถเลือกด้านบนหรือด้านล่างของหน้าจอ. สิ่งนี้ทำให้ Offcanvas ยอดเยี่ยมสำหรับ มากกว่า ไม่ใช่แค่เลื่อนเมนูแฮมเบอร์เกอร์...

Modals ได้รับการสนับสนุนอย่างกว้างขวางในเบราว์เซอร์ที่ทันสมัย พวกเขาสามารถใช้เป็น ป๊อปอัปแจ้งเตือน, เช่น เลือกในฟิลด์, หรือแม้กระทั่งสำหรับ ภาพสไลด์โชว์. คุณสามารถสร้างหน้าต่างเหล่านี้โดยใช้ CSS บริสุทธิ์ แต่นี่ไม่ใช่ทางออกที่เข้าถึงได้มากที่สุด แต่ให้ตรวจสอบ A11y กล่องโต้ตอบ, หน้าต่างโมดัลที่ใช้งานได้อย่างเต็มที่ซึ่งให้ความสำคัญกับ การเข้าถึงก่อน. มันวิ่งต่อไป JavaScript วานิลลา กับมัน API ที่กำหนดเองของตัวเอง และรองรับเบราว์เซอร์ที่ทันสมัยทั้งหมดในทุกอุปกรณ์ คุณสามารถตรวจสอบ การสาธิตนี้ เพื่อดูว่ามันทำงานอย่างไร. ดูเหมือนว่าจะเป็นหน้าต่างโมดัลทั่วไป แต่สคริปต์นี้ ใช้แท็ก...

ด้วยกันมากมาย ตัวอย่าง CSS และตัวสร้างโค้ดฟรี, ไม่จำเป็นต้องบูรณาการล้อ นักพัฒนาสมาร์ทพึ่งพาไลบรารีที่มีอยู่เพื่อสร้างองค์ประกอบหน้าอย่างง่ายเช่นเมนูการนำทางและปุ่ม. หนึ่งในห้องสมุดดังกล่าวคือ Bttn.css, สร้างโดยนักพัฒนา Ganapati V S. ผลงานของเขาประณีตและไลบรารี่ปุ่มนี้เป็นหนึ่งในดีที่สุดสำหรับการพัฒนาส่วนหน้าที่ทันสมัย. บนโฮมเพจปุ่มคุณสามารถเลือกระหว่าง ขนาดเล็กกลางและใหญ่, พร้อมด้วย โทนสีต่างๆ. ปุ่มมา ที่สร้างไว้ล่วงหน้า และ พร้อมที่จะไป, ดังนั้นสิ่งที่คุณต้องมีก็คือไลบรารี CSS ที่แท้จริงและคลาสที่เหมาะสมสำหรับปุ่มของคุณ. คุณสามารถดาวน์โหลดห้องสมุด จาก GitHub หรือคุณสามารถใช้ รุ่น CDN...

ไม่นานมานี้ฉันเขียนเกี่ยวกับ Fontjoy เครื่องมือเว็บที่พัฒนาโดย แจ็คเฉียว ที่ใช้ปัญญาประดิษฐ์เพื่อจับคู่แบบอักษร หลังจากพัฒนาเครื่องมือจับคู่แบบอักษรปรากฏว่า เฉียวตัดสินใจต่อยอดกับ A.I. และออกแบบในขณะที่เขาคิดค้นเครื่องมือการออกแบบเว็บที่ขับเคลื่อนโดย A.I ซึ่งเรียกว่า brandmark. ที่ Fontjoy ถูกใช้เป็นเครื่องมือจับคู่แบบอักษรที่ค่อนข้างง่าย Brandmark มีจุดมุ่งหมายสูงกว่าเล็กน้อยเนื่องจากเป็น A. ผู้สร้างโลโก้ขับเคลื่อนด้วย A.I. ในฐานะที่เป็นหน้าแนะนำแสดงเครื่องมือเว็บนี้กำลังมองหาเพื่อให้ผู้ที่สนใจโลโก้ของพวกเขาเอง, สมบูรณ์ด้วยกราฟิกตัวอักษรและสี สำหรับมัน. การใช้ Brandmark นั้นค่อนข้างง่ายและสะดวก สิ่งที่คุณต้องทำคือป้อนชื่อ บริษัท ของคุณ (และสโลแกนถ้ามี),...

การเปิดตัวครั้งใหญ่ครั้งต่อไปของเฟรมเวิร์ก Bootstrap อยู่ใกล้ ๆ เวอร์ชั่นอัลฟ่าสามารถดาวน์โหลดได้จากเว็บไซต์การพัฒนาของ Bootstrap และซอร์สโค้ดยังมีอยู่ใน Github. Twitter Bootstrap เป็นส่วนหน้าของเฟรมเวิร์กที่ได้รับความนิยมมากที่สุด มันช่วยให้นักพัฒนา สร้างเว็บไซต์บนมือถือและตอบสนองได้อย่างรวดเร็ว. Bootstrap ช่วยให้สามารถใช้ส่วนหน้า HTML5, CSS3 และ Javascript แบบมาตรฐานได้อย่างชาญฉลาด ปัจจุบันมีการใช้งานมากกว่า 6 ล้านเว็บไซต์บนเว็บ. แม้ว่า Bootstrap 4 ยังอยู่ในช่วงการพัฒนา (ดังนั้นอย่าใช้บนเว็บไซต์จริง) แต่นักพัฒนาก็ทำผลงานได้อย่างยอดเยี่ยม ในโพสต์นี้เราจะมาดูเวอร์ชั่นใหม่ซึ่งรวมถึงคุณสมบัติที่ยอดเยี่ยมมากมายที่จะแน่นอน...

เราทุกคนต้องการทำให้เสร็จเร็วขึ้น โปรแกรมการออกแบบช่วยเรา สร้างอินเตอร์เฟสที่น่าทึ่ง, แต่บางครั้งเมนู clunky อาจทำให้กระบวนการช้าลง. กับ ปลั๊กอิน Sketch Runner, คุณสามารถ ทำให้เวิร์กโฟลว์ Sketch ของคุณเป็นแบบอัตโนมัติ ตลอด คำสั่งที่พิมพ์ ที่เปิดเมนูกำหนดเป้าหมายองค์ประกอบของหน้าและแม้แต่คำสั่งปลั๊กอินอัตโนมัติ. คุณอาจกำลังคิด “ฉันใช้แป้นพิมพ์ลัดไม่ได้หรือ?” แน่นอน! แต่ Sketch Runner เพิ่มเลเยอร์อื่นให้กับเวิร์กโฟลว์ของคุณ ทางลัดนั้นไม่สามารถจับคู่ได้. คุณสามารถใช้คำสั่งที่ละเอียดมาก เลือกกลุ่มหรือเลเยอร์ใดก็ได้ บนหน้าหรือแม้กระทั่งคำสั่งที่ แทรกรูปร่างที่กำหนดไว้ล่วงหน้าที่เฉพาะเจาะจง ลงบนผืนผ้าใบ....

นักออกแบบเว็บไซต์ทุกคนควรรู้ การไล่ระดับสี CSS3. มีมานานหลายปีแล้วและได้รับการสนับสนุนอย่างกว้างขวางจากเบราว์เซอร์หลักทั้งหมด. และตอนนี้เว็บแอปฟรีเช่น การผสมผสาน ให้คุณสร้างการไล่ระดับสี CSS3 ได้ทันทีด้วย โปรแกรมแก้ไขภาพในเบราว์เซอร์. คุณสามารถเลือกระหว่าง การไล่ระดับสีเชิงเส้นและรัศมี ในขณะที่ตกแต่งด้วยสีที่จะผสมผสาน. หน้าเริ่มต้นโหลดด้วย สองสีทึบ ทั้งสองด้าน คุณสามารถใช้ จานสี เพื่อสลับระหว่างเฉดสีหรือป้อน รหัส HEX ด้วยตนเอง ถ้าคุณรู้สีที่คุณต้องการ เมื่อคุณมีสองสีที่คุณต้องการแล้วให้คลิก “มาผสมผสานกัน” ปุ่ม ในศูนย์. ทั้งสองสีผสมผสานกันเป็นแบบไล่ระดับสี CSS3 ด้วย...

หากคุณทำงานประเภทใดก็ตามเว็บไซต์ผลงานที่น่าประทับใจคือหนึ่งในความต้องการที่สำคัญที่สุดของคุณ และก้าวแรกสู่ ออกแบบเว็บไซต์ของคุณเอง กำลังศึกษาไซต์อื่น ๆ เพื่อหาแนวคิด. แนวคิดการออกแบบเล็กน้อยเหล่านี้อาจดูไม่มีนัยสำคัญในตอนแรก แต่เมื่อคุณรวมทั้งหมดเข้าด้วยกันคุณจะเริ่มเห็นภาพที่ใหญ่ขึ้นสำหรับเว็บไซต์ผลงานส่วนตัวของคุณ. ค้นหาพอร์ตการลงทุนที่มีคุณภาพและรวบรวมแนวคิด ใช้เวลา. อย่างไรก็ตามด้วย Bestfolios คุณสามารถลดเวลาที่ใช้ในการค้นหาและขุดลงในเว็บไซต์ที่ดูดีได้ทันที. ไซต์ Bestfolios นั้นเหมือนกับแกลเลอรีที่ได้รับแรงบันดาลใจอื่น ๆ เว็บไซต์นี้ มุ่งเน้นไปที่พอร์ตการลงทุนของนักออกแบบเท่านั้น, นักออกแบบฟีเจอร์หลายคนที่ทำงานใน บริษัท ยักษ์ใหญ่เช่น Google และ Facebook. ในความเป็นจริงถ้าคุณตรวจสอบหน้าคอลเลกชันคุณสามารถเรียกดูพอร์ตการลงทุนตาม หัวข้อที่คัดสรรแล้วเช่น บริษัท เทคโนโลยีเฉพาะ. ตอนนี้คอลเล็กชันมีขนาดเล็ก...