วิธีการเปลี่ยนตัวชี้เมาส์โดยใช้ OnMouseOver

ผู้เขียน: Frank Hunt
วันที่สร้าง: 15 มีนาคม 2021
วันที่อัปเดต: 15 พฤษภาคม 2024
Anonim
Mouse Hover Action using Actions Class in Selenium WebDriver | Automation Tutorials | Day17
วิดีโอ: Mouse Hover Action using Actions Class in Selenium WebDriver | Automation Tutorials | Day17

เนื้อหา

เหตุการณ์ "OnMouseOver" จะถูกเรียกใช้เมื่อผู้ใช้ผ่านตัวชี้เมาส์ไปที่องค์ประกอบของหน้า สิ่งนี้สามารถเกิดขึ้นได้กับองค์ประกอบใด ๆ เช่นรูปภาพปุ่มตารางหรือเพจเอง คุณสามารถเปลี่ยนไอคอนที่แสดงต่อผู้ใช้เมื่อตัวชี้เมาส์ข้ามองค์ประกอบเหล่านี้โดยใช้ Javascript ในคุณสมบัติการควบคุม เหตุการณ์ "OnMouseOver" ใช้กับ "OnMouseOut" ซึ่งถูกทริกเกอร์เมื่อตัวชี้เมาส์ไม่อยู่ในองค์ประกอบอีกต่อไปและใช้สำหรับไอคอนตัวชี้เพื่อกลับไปที่ภาพดั้งเดิม


คำสั่ง

เหตุการณ์ "OnMouseOver" จะถูกเรียกใช้เมื่อคุณวางเมาส์เหนือองค์ประกอบที่กำหนด (รูปเมาส์คอมพิวเตอร์โดย Edyta Anna Grabowska จาก Fotolia.com)
  1. เปิดไฟล์ HTML ด้วยโปรแกรมแก้ไขข้อความที่คุณชื่นชอบ เลื่อนลงไปที่องค์ประกอบ HTML ที่คุณต้องการแก้ไข มันสามารถเป็นองค์ประกอบใด ๆ ในหน้า ในตัวอย่างนี้ฉลาก "

  2. กำหนดรหัส Javascript ให้กับเหตุการณ์ "OnMouseOver" ที่เปลี่ยนตัวชี้เมาส์ โค้ดต่อไปนี้เปลี่ยนพอยน์เตอร์เป็นมือเล็ก ๆ เมื่อผู้ใช้วางเมาส์เหนือภาพ:

  3. ให้ตัวชี้เมาส์กลับไปที่ไอคอนดั้งเดิมหลังจากที่มันไม่ได้อยู่ในองค์ประกอบ หากคุณไม่ได้กำหนดค่าเหตุการณ์ "OnMouseOut" เมาส์จะยังคงมีการเปลี่ยนแปลงในขณะที่ผู้ใช้นำทางหน้า รหัสต่อไปนี้ทำให้ตัวชี้เมาส์กลับสู่ค่าเริ่มต้น: