เพิ่ม Margin Hover Text ไปยังเว็บไซต์ใด ๆ ได้อย่างง่ายดายด้วย Marginotes
เคล็ดลับเครื่องมือแบบอินไลน์ ยอดเยี่ยม แต่บางครั้งพวกเขาก็ไม่เหมาะกับเนื้อหาบางอย่าง เว็บไซต์ส่วนใหญ่จะเว้นที่ว่างไว้ตามขอบของหน้าเว็บซึ่งเหมาะสำหรับการเพิ่ม เนื้อหาสไตล์คำแนะนำเครื่องมือโดยไม่มีคำแนะนำเครื่องมือ.
เข้าสู่ Marginotes, ปลั๊กอินโอเพ่นซอร์ส jQuery ฟรี เพิ่มบันทึกย่อที่กำหนดเองให้กับระยะขอบ ของหน้าเว็บของคุณ คุณสามารถสลับบันทึกเหล่านี้ตามลิงก์หรือองค์ประกอบบางอย่างในหน้าเช่นรูปภาพ.
ปลั๊กอินนี้ติดตั้งง่ายอย่างน่าประหลาดใจและมาพร้อมกับ สไตล์ชีทเริ่มต้น สำหรับหมายเหตุของคุณ สิ่งเหล่านี้จะปรากฏขึ้น ออกไปด้านข้าง ของเนื้อหาของคุณและพวกเขาจัดชิดขวาถัดจากองค์ประกอบย่อหน้าบนหน้าเว็บของคุณ.
โน้ตโฮเวอร์คือ เพิ่มด้วยตนเอง ในองค์ประกอบ HTML ของคุณ, ใช้งาน รายละเอียด คุณลักษณะ. ฉันไม่เคยเห็นสิ่งนี้ใน HTML5 ดังนั้นฉันจึงไม่สามารถพูดได้ว่าเป็นไปตามข้อกำหนดทั้งหมดหรือไม่ แต่จะรับโดย JavaScript ซึ่งเป็นสิ่งที่คุณต้องการจริงๆ.
นอกจากนี้คุณยังสามารถ เปลี่ยนแอตทริบิวต์นี้ เมื่อคุณเรียกใช้ marginotes () ฟังก์ชั่นดังนั้นคุณสามารถเปลี่ยนเป็นสิ่งที่ต้องการ ข้อมูลรายละเอียด หากคุณกำลังมองหาที่จะเข้ากันได้มากขึ้น.
นี่คือ jQuery หนึ่งบรรทัด จำเป็นต้องใช้งานปลั๊กอินนี้:
$ ( "เลือก"). marginotes ()
คุณควรแทนที่ "ตัวเลือก" ด้วยองค์ประกอบอะไรก็ตามที่คุณกำหนดเป้าหมาย ดังนั้นหากอยู่ในเนื้อหาของหน้าคุณอาจใช้ ".body span". คุณสามารถ ลิงก์จุดยึดเป้าหมาย หรือ โดยบางคลาส เพิ่มไปยังองค์ประกอบเหล่านี้.
ข้างใน marginotes () ฟังก์ชั่นคุณสามารถเพิ่ม พารามิเตอร์ทางเลือกสองตัว เพื่อเปลี่ยนรูปแบบหมายเหตุของระยะขอบ:
ความกว้าง- ตั้งค่าความกว้างโน้ต (ค่าเริ่มต้นคือ 100px)สนาม- ตั้งค่าคุณสมบัติเนื้อหา HTML (ค่าเริ่มต้นเป็น"รายละเอียด")
นอกจากนี้หากคุณไม่ชอบใช้ jQuery คุณสามารถลอง ปลั๊กอินวานิลลามาร์จิ้น. มันทำงานบนวานิลลา JS ดังนั้นคุณมี ศูนย์พึ่งพา เพื่อรับคุณสมบัติเดียวกันทั้งหมด.
คุณสามารถตรวจสอบสิ่งนี้ การสาธิตสด ถ้าคุณต้องการที่จะเห็นมันในการดำเนินการ นี่เป็นปลั๊กอินที่ไม่เหมือนใครและเป็นวิธีที่ยอดเยี่ยม เพิ่มเนื้อหาพิเศษบางอย่าง ในเว็บไซต์ของคุณ.
