วิธีการสร้างลักษณะพิเศษการโฮเวอร์สำหรับปุ่มฟอร์มที่ใช้ DHTML และ CSS ใน FrontPage

การแปลบทความ การแปลบทความ
หมายเลขบทความ (Article ID): 222949 - ผลิตภัณฑ์ที่เกี่ยวข้องในบทความนี้
ขยายทั้งหมด | ยุบทั้งหมด

สรุป

ของ frontpage 2000 และ FrontPage 2002 ประกอบด้วยชุด rich Cascading ลักษณะแผ่น (CSS) และ HTML แบบไดนามิก (DHTML) การเขียนแก้ความสามารถที่ช่วยให้คุณสามารถสร้างลักษณะพิเศษการโฮเวอร์หลากหลาย บทความนี้คุณสามารถสร้างโฮเวอร์ปุ่มลักษณะสำหรับปุ่มเขตฟอร์มทั่วไป โดยใช้ลักษณะการทำงานของ CSS และ DHTML ที่จัดรูปแบบได้

ข้อมูลเพิ่มเติม

เมื่อต้องการสร้างลักษณะพิเศษของปุ่มสำหรับเขตข้อมูลฟอร์มปุ่มโฮเวอร์ ดำเนินการดังต่อไปนี้:
  1. สร้างหน้าใหม่ ว่างเปล่า
  2. ในการแทรกเมนู ให้ชี้ไปที่แบบฟอร์มคลิกแบบฟอร์ม.
  3. เมื่อต้องการใช้ค่าเริ่มต้น"ส่ง"ปุ่มสี ทำตามขั้นตอนเหล่านี้:

    1. คลิกขวาส่งปุ่ม แล้วคลิกคุณสมบัติเขตข้อมูลฟอร์ม.
    2. คลิกลักษณะ.
    3. คลิกรูปแบบ:แล้วเส้นขอบ.
    4. คลิกการแรเงาแท็บ
    5. คลิกเพื่อเลือกสีในการสีพื้นหน้าและสีพื้นหลังแสดงรายการไว้
    6. คลิกตกลงสามครั้งเพื่อกลับไปเอกสาร
  4. เมื่อต้องการแทรกสีโฮเวอร์ DHTML ดำเนินการดังต่อไปนี้:

    1. คลิกการส่งปุ่ม
    2. ในการรูปแบบ:เมนู คลิกลักษณะพิเศษแบบไดนามิกของ HTML.
    3. ในการบนรายการ คลิกเพื่อเลือกเมาส์น้อยเกินไป.
    4. ในการนำไปใช้รายการ คลิกเพื่อเลือกการฟอร์แมต.
    5. คลิกเพื่อเลือกเลือกเส้นขอบด้านขวาของรายการจะนำไปใช้รายการ
    6. คลิกการแรเงาแท็บ
    7. คลิกเพื่อเลือกสีในการสีพื้นหน้าและสีพื้นหลังแสดงรายการไว้
    8. คลิกตกลงปิดลักษณะพิเศษของ dhtmlแถบเครื่องมือ
  5. เมื่อต้องการย้ายสีโฮเวอร์ปุ่มส่ง ดำเนินการดังต่อไปนี้:

    1. สลับไปยังมุมมอง HTML
    2. ในมุมมอง HTML ย้ายรหัสต่อไปนี้จากนั้น<p></p>การติดแท็กเพื่อที่การของคุณ<input>แท็ก:
         dynamicanimation="fpAnimformatRolloverFP1"
         fprolloverstyle="background-color: #000000; color: #FFFFFF"
         onmouseover="rollIn(this)"
         onmouseout="rollOut(this)"
         language="Javascript1.2"
      								
      หมายเหตุ:: ค่าสำหรับ "สีพื้นหลัง" และ "สี" อาจแตกต่างจากที่แสดงในรหัสก่อนหน้านี้
  6. ถ้าคุณต้อง ทำซ้ำขั้นตอนเพียงไม่กี่ครั้งล่าสุดสำหรับการresetปุ่ม
  7. เมื่อทำการตามขั้นตอนก่อนหน้านี้เสร็จเรียบร้อยแล้ว โค้ด HTML ของคุณอาจดูเหมือนกับรหัสอย่างต่อไปนี้ของ HTML:
       <input type="submit" value="Submit"
          style="background-color: #008000; color: #000000"
          dynamicanimation="fpAnimformatRolloverFP1"
          fprolloverstyle="background-color: #000080; color: #FFFFFF"
          onmouseover="rollIn(this)"
          onmouseout="rollOut(this)"
          language="Javascript1.2">
    
       <input type="reset" value="Reset"
          style="background-color: #800000; color: #FFFFFF"
          dynamicanimation="fpAnimformatRolloverFP1"
          fprolloverstyle="background-color: #000080; color: #FFFFFF"
          onmouseover="rollIn(this)"
          onmouseout="rollOut(this)"
          language="Javascript1.2">
    						
  8. บันทึกเพจนี้ไปยังเดสก์ท็อปของคุณเป็น"HoverTest.htm"และลด FrontPage
  9. คุณจะสังเกตเห็นว่า FrontPage บันทึกแฟ้มต่อไปนี้ที่สองไปยังเดสก์ท็อปของคุณ:

    • HoverTest.htm
    • Animate.js
    แฟ้มแรกมีเพจที่คุณสร้างไว้ในขั้นตอนก่อนหน้านี้ แฟ้มสองคือ ชุดของ DHTML ฟังก์ชันที่หน้าจะใช้
  10. เปิด"HoverTest.htm"ใน Internet Explorer 4.0 หรือใหม่กว่า ขอให้สังเกตว่า เมื่อคุณเลื่อนเมาส์บนแต่ละปุ่ม คุณจะเห็นสีที่เปลี่ยนแปลง

คุณสมบัติ

หมายเลขบทความ (Article ID): 222949 - รีวิวครั้งสุดท้าย: 8 มกราคม 2554 - Revision: 4.0
ใช้กับ
  • Microsoft FrontPage 2000 Standard Edition
  • Microsoft FrontPage 2002 Standard Edition
Keywords: 
kbbutton kbprogramming kbscript kbforms kbnewfile kbhowto kbmt KB222949 KbMtth
แปลโดยคอมพิวเตอร์
ข้อมูลสำคัญ: บทความนี้แปลโดยซอฟต์แวร์การแปลด้วยคอมพิวเตอร์ของ Microsoft แทนที่จะเป็นนักแปลที่เป็นบุคคล Microsoft มีบทความที่แปลโดยนักแปลและบทความที่แปลด้วยคอมพิวเตอร์ เพื่อให้คุณสามารถเข้าถึงบทความทั้งหมดในฐานความรู้ของเรา ในภาษาของคุณเอง อย่างไรก็ตาม บทความที่แปลด้วยคอมพิวเตอร์นั้นอาจมีข้อบกพร่อง โดยอาจมีข้อผิดพลาดในคำศัพท์ รูปแบบการใช้ภาษาและไวยากรณ์ เช่นเดียวกับกรณีที่ชาวต่างชาติพูดผิดเมื่อพูดภาษาของคุณ Microsoft ไม่มีส่วนรับผิดชอบต่อความคลาดเคลื่อน ความผิดพลาดหรือความเสียหายที่เกิดจากการแปลเนื้อหาผิดพลาด หรือการใช้บทแปลของลูกค้า และ Microsoft มีการปรับปรุงซอฟต์แวร์การแปลด้วยคอมพิวเตอร์อยู่เป็นประจำ
ต่อไปนี้เป็นฉบับภาษาอังกฤษของบทความนี้:222949

ให้ข้อเสนอแนะ

 

Contact us for more help

Contact us for more help
Connect with Answer Desk for expert help.
Get more support from smallbusiness.support.microsoft.com