About DwThai.Com 00

DwThai.Com Logo

DwThai.Com

Tip and Trick Dreamweaver

ก่อตั้งเมื่อปีพุทธศักราช ๒๕๔๖





ค้นหาข้อมูลใน DwThai.Com

สร้างปุ่มกดให้กลายเป็น Link (Button Link with Dreamweaver) [Article ID : 133]


เรื่อง : การทำปุ่มกดให้เป็นลิงค์เพื่อกดไปหน้าอื่นด้วย Dreamweaver

โดยปรกติถ้าต้องการสร้าง Link บนหน้าเว็บเพจ เราต้องใช้ Text หรือ Images เพื่อสร้างเป็นจุดที่ต้องการให้คลิกลิงค์ไปยังหน้าอื่น แต่ก็จะมีบางครั้งที่เราจำเป็นต้องใช้ปุ่มกด หรือ Button เพื่อสร้างเป็นจุดให้กด เมื่อกดแล้วจะเปิดหน้าอื่นขึ้นมา ซึ่งในบทความนี้จะมาแนะนำกันครับ ว่าทำอย่างไรกับโปรแกรม Dreamweaver
Request for MySQLi Database Connector

วิธีการสร้างปุ่มกดให้เป็น Link เปิดหน้าอื่น

การสร้างให้ปุ่มกดเป็นลิงค์นั้น แน่นอนว่าที่หน้าเว็บเพจต้องมีปุ่มกดเสียก่อน โดยให้ทำการ Insert ปุ่มกดลงไปที่เว็บเพจ ดังนี้

สร้าง Button หรือปุ่มกดขึ้นมาเสียก่อน

ที่หน้าเว็บเพจ นำ Cursor ไปวางไว้ในตำแหน่งที่ต้องการให้แสดงปุ่มกด จากนั้นปฏิบัติตาม ดังนี้

1. ที่ Insert Panel เลือกไปที่ Form จากนั้นเลือกไปที่ Button ดังรูป 2. เมื่อเลือกไปที่ Button แล้ว โปรแกรมจะ Insert ปุ่มกดให้เราที่หน้าเว็บเพจ ดังรูป
จากตัวอย่างเป็น Button โดย Dreamweaver CC หากท่านใดใช้ Dreamweaver ตระกูล CS เช่น CS5, CS6 ให้ทำการกำหนด Properties เพิ่มเติม โดยการกำหนดให้ปุ่มเป็น None ดังรูป

จากนั้นสร้าง Action ให้กับ Button โดยใช้ Behaviors

เมื่อหน้าเว็บเพจเรามีปุ่มกดแล้ว ขั้นตอนต่อมา ให้ทำการใส่ Action ให้แก่ปุ่มกดนั้น ดังนี้

3. ให้เลือกไว้ที่ปุ่มกดนั้น
4. จากนั้นเปิดหน้าต่าง Behaviors ขึ้นมา โดยไปที่ Menu -> Window -> Behaviors ดังรูป 5. จากนั้นไปที่หน้าต่าง Behaviors กดไปที่เครื่องหมายบวก (+) แล้วเลือกไปที่เมนู Go To URL ดังรูป 6. โปรแกรมจะทำการเปิดหน้าต่างขึ้นมาให้กำหนดค่า ดังรูป ที่หน้าต่างนี้ให้ทำการกำหนดค่า ดังนี้
- URL : พิมพ์ URL ของเว็บที่จะเชื่อมโยง หรือกดปุ่ม Browse... ด้านข้าง เพื่อเลือกไฟล์กรณีต้องการเชื่อมโยงไปที่ไฟล์อื่นในไซต์เดียวกัน
*ในตัวอย่าง เชื่อมโยงมาที่เว็บ DwThai.Com

7. เมื่อกำหนดค่าในข้อ 6 ได้แล้วกดที่ปุ่ม OK ของหน้าต่าง Go To URL เป็นอันเสร็จการสร้างลิงค์ให้แก่ปุ่มกด
8. ทำการกดปุ่ม F12 เพื่อทดสอบผลลัพธ์กับ Web Browser
การสร้างปุ่มกดให้เป็น Link ลักษณะนี้ แตกต่างจากการสร้างลิงค์โดยใช้ Text หรือรูปภาพ เนื่องจาก Go To URL ที่ได้ใช้ไปกับปุ่มกดนั้น ที่จริงคือ JavaScript ในขณะที่ลิงค์ในรูปแบบข้อความ/รูปภาพ จะเป็นการสร้างลิงค์ในแบบ HTML อย่างไรลองใช้ดู...สวัสดีครับ.
About the Author
Mr.Sittichai Raksasuk

Mr.Sittichai Raksasuk

Sittichai is a Web Developer and Web Technology Instructor for over 10 yrs. He is also a webmaster of dwthai.com and author jQuery with Dreamweaver (2010). DwThai.Com is a website for web developer using Adobe Dreamweaver.

Contact with him : dwthai@gmail.com



บทความอื่นที่คุณอาจสนใจ

วิธีการออกแบบเว็บในแบบ Responsive ด้วย Dreamweaver ตอนที่ 2

เรื่อง : การออกแบบ Responsive Web Design ด้วย Dreamweaver ตอนที่ 2 ต่อจากตอนที่ 1 ที่เราได้ทำการ Create ไฟล์สำหรับการเริ่...  

สร้างโปรแกรม Guestbook ด้วย Dreamweaver + PHP + MySQL ตอนที่ 4 [จบ]

ในตอนที่ 3 ที่ผ่านมาเราได้ทำการสร้างตารางสำหรับการแสดงผลเตรียมรอไว้แล้ว มาในตอนที่ 4 นี้ เราจะมาทำการสร้างโปรแกรมสำหรับให้ผู้เยี่ย...  

เปิดหน้าต่าง Code เพื่อแก้ไขโค้ดได้อย่างรวดเร็ว

เรื่อง : เปิดหน้าต่างเพื่อแก้ไข Source Code เว็บเพจ (Code Inspector) ทุกครั้งที่ผู้ใช้งานโปรแกรม Dreamweaver ...  

สร้าง Popup Menu ด้วย Spry Menu Bar (CS Only)

เรื่อง : การสร้างเมนูเว็บไซต์ด้วย Spry Menu Bar *Dreamweaver CC ไม่มีให้ใช้ครับ Spry เป็น Framework...  


Copyright ©2003-2019 dwthai.com. All rights reserved.
This website was created by : S.raksasuk.

ติดต่อ DwThai.Com

e-mail : dwthai@gmail.com
mobile: 08-9495-7296

เขียน Guestbook : DwThai.Com

*
*
*