Toolkit - หน้า 28

ภาพเคลื่อนไหวบนเว็บ ได้มาไกล นักพัฒนาสามารถสร้างภาพเคลื่อนไหวใด ๆ โดยใช้คอมโบของ CSS / SVG / JS แต่มี ห้องสมุดฟรีหลายสิบแห่ง เพื่อประหยัดเวลาในกระบวนการ. หนึ่งในรายการโปรดของฉันคือ Anime.js, โอเพนซอร์สที่สมบูรณ์ฟรี ไลบรารีภาพเคลื่อนไหว JavaScript. ห้องสมุดนี้สามารถ ทำมันทั้งหมด. มัน สร้างขึ้นบน JavaScript แต่มันก็ยัง อาศัยภาพเคลื่อนไหว CSS เป็นอย่างมาก. คุณสามารถกำหนดเป้าหมายองค์ประกอบของแต่ละหน้า ผ่าน DOM...

มีหลายสิ่งที่คุณสามารถทำได้ Chrome DevTools ตั้งแต่การแก้ไขเว็บไซต์สดไปจนถึงศึกษาคำขอ HTTP โดยละเอียด แต่ ความสามารถในการวิเคราะห์รูปแบบ CSS ไม่ได้ถูกอบเข้าสู่คอนโซล. กับ CSS CSS, คุณสามารถวิเคราะห์ได้ทั้งหมด CSS selectors, ความจำเพาะ, และ คุณสมบัติที่เป็นเอกลักษณ์ ของหน้าเว็บใดก็ได้จาก Chrome ส่วนขยายนี้ฟรีทั้งหมดและมอบพลังมากมายให้กับผู้พัฒนาส่วนหน้า. เมื่อคุณตรวจสอบสไตล์ชีทคุณจะได้รับข้อมูลจำนวนมากจากแผง CSS Dig มันสามารถแสดงให้คุณ ตัวเลือกส่วนบุคคล, รวมไปถึง ที่ซ้ำกัน และ...

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

คุณจะเห็นคุณลักษณะนี้มากมายในไซต์ขนาดใหญ่เช่น TechCrunch และ Mashable คุณจะอ่านบทความและสังเกตว่าประโยคทั้งหมดเป็น ไฮไลต์เหมือนลิงก์. แต่เมื่อคุณคลิกมันจะ เปิดหน้าต่างทวีต ขอให้คุณแบ่งปันตัวอย่างข้อความนั้นกับผู้ติดตาม Twitter ของคุณ มันเป็นวิธีที่ยอดเยี่ยม เพิ่มอัตราการเข้าชมเว็บไซต์ของคุณ และสนับสนุนการแบ่งปันทางสังคมมากขึ้น. ในการทำซ้ำเอฟเฟกต์นี้ในเว็บไซต์ของคุณลอง InlineTweet.js. มันสามารถช่วยคุณประหยัดเวลาในการตั้งค่าได้หลายชั่วโมงโดยการเพิ่มฟังก์ชั่นนี้ไปยังหน้าของคุณ. ปลั๊กอิน JavaScript นี้ฟรีติดตั้งง่ายสุด ๆ และยังมี ปลั๊กอิน WordPress ฟรี ถ้าคุณชอบเส้นทางนั้น. มัน ไม่ต้องการการพึ่งพา JavaScript ใด...

เบราว์เซอร์ส่วนใหญ่มี ฟังก์ชัน CTRL + F เพื่อค้นหาและค้นหาสิ่งที่ผู้ใช้ต้องการ แต่คุณสมบัตินี้ ไม่รองรับโทรศัพท์มือถือ และมันใช้งานไม่ได้กับข้อความแบบไดนามิก. โชคดีที่มี Mark.js, ปลั๊กอิน JavaScript ฟรีที่เพิ่ม เน้นคุณสมบัติการค้นหา ไปที่หน้าใดก็ได้อย่างง่ายดาย. โดยค่าเริ่มต้นมันทำงานเป็น ปลั๊กอินวานิลลา JS แต่ยังสามารถเรียกใช้ ด้านบนของ jQuery. มันเป็นโครงการโอเพ่นซอร์สอย่างสมบูรณ์ดังนั้นคุณสามารถใช้งานได้ฟรีในเว็บไซต์เชิงพาณิชย์หรืออื่น ๆ. มันทำงานคล้ายกับคุณลักษณะการค้นหาเบราว์เซอร์ใด ๆ ยกเว้นมันมาพร้อมกับสารพัดพิเศษ คุณสามารถเพิ่ม ตัวกรองที่กำหนดเองของคุณเอง และค้นหาคำตาม...

พวกเราส่วนใหญ่รู้เกี่ยวกับแถบความคืบหน้าและวิธีการทำงานของเหล่านี้ในการออกแบบ UI พวกเขาช่วย กำหนดเวลาโหลดหน้าฟอร์มอัพโหลดและช่วงเวลาล่าช้าที่คล้ายกัน ระหว่างหน้า. แต่ ขั้นตอนความคืบหน้า แตกต่างกันเล็กน้อย การทำงานเช่น breadcrumbs ที่ด้านบนของหน้าเพื่อแนะนำผู้ใช้ผ่านกระบวนการทีละขั้นตอน (โดยปกติจะเป็นแบบฟอร์มสมัครและชำระเงิน). ด้วย jQuery Steps ที่คุณสามารถทำได้ เพิ่มขั้นตอนความคืบหน้าที่กำหนดเองลงในหน้าใด ๆ ได้อย่างรวดเร็ว ของเว็บไซต์ของคุณ. ปลั๊กอินทั้งหมดทำงานบน jQuery และปล่อยฟรีใน GitHub. คุณสามารถเรียกใช้เหล่านี้ ขั้นตอนความคืบหน้าเป็นคุณสมบัติหลายหน้า ที่แนะนำผู้เข้าชมผ่านหน้าต่างๆในเว็บไซต์ของคุณ หรือคุณสามารถเรียกใช้สิ่งนี้เช่นขั้นตอน Ajax ที่จะย้ายผู้ใช้...

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

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