Nov 21, 2011

สร้างลิ้งค์บนรูปภาพง่ายนิดเดียว

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhkRTH0zgYKZ0Ulg8kHogwU0CEqUeCGmxTQ5lUzCFDxJBAJXCeSRGhkT8ur5k75jDQIU07RWSQKyCkdY17xDJ_ZRR6lE7zYbBJCDslBozsNhaqZPvtMHFihvxEyC73O7wpYN3Edk9-wjNH7/s559/Test-Map.png

การสร้างรูปภาพออกมาให้คลิกได้นั้นดูเหมือนเป็นงานที่ยาก เนื่องจากต้องมานั่งเขียนการเชื่อมโยงลิ้งค์ในแต่ละส่วนของภาพ

4dots Imagemapper เป็นโปรแกรมที่จะสามารถทำให้การสร้าง การคลิกลิ้งค์ที่รูปภาพเป็นไปได้ง่ายยิ่งขึ้น เพียงการหารูปภาพมาจากนั้นก็กำหนดพื้นที่ขอบเขตของลิ้งค์ที่ต้องการก็เป็น อันเสร็จ

เริ่มแรกคลิกที่ New Map และเลือก image map type จากนั้นก็กำหนดค่าต่างๆ เลือกรูปจากไดร์ฟ, กำหนดชื่อของรูปภาพ, URL เริ่มต้น และการเปิดเริ่มต้น

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiDngwOgZW8380Hd3m0jASTQitZmLx3f-RpDG5lmXk59XSE9OZYKY7A8jYmnrPr8JS0rf7moTgGQBILq679PTUkLlWjq5L-stLZnkZz8qi84epUes-tFsslffQzEpu3pfVlyiLVthU9Wpxk/s660/Image-mapper.png

เมื่อกำหนดค่าต่างๆ แล้ว ก็ให้เลือกรูปเรขาคณิตจากแถบเครื่องมือด้านบน และไฮไลท์พื้นที่บนรูปภาพเพื่อที่จะให้พื้นที่นั้นสามารถคลิกได้นั่นเอง

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgk514dzmlm13wHH0EPCELr32YSCTzX2tlDybDeRzcsaKoAZ5UqKv92c_lAVQqU55dQBZfXvH2EXmHvIGyQySm6UhY600PaxJwlsvTuPhsYHTY3miMfqWRI4KZI-5f-h_IV3nCo-xelq7Xm/s660/Select-Area.png

จากนั้นก็จะมีหน้าต่างเด้งขึ้นมา ให้คุณใส่ลิ้งค์, ข้อความ, ข้อความเมื่อนำเม้าส์เลื่อนไปวาง, ข้อความเมื่อนำเม้าส์เลื่อนออกไป, เฟรมต่างๆ

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjvOrqa5p-i_JxYa0cNLDRls3gpN9RtS1AavZODiQE70lgvhKkTtx8Yikb_P64y2baQY0hQKxifiqQ5xoShcmnqI2xR0D9sZYUhSvOunOoHANzr-Jtfn5fbyaD6q9hnUi4kUdiDRic19nyF/s600/Settings6.png

เมื่อคุณสร้างเสร็จเรียบร้อย สามารถคลิกที่ Test Map เพื่อทดสอบก่อนใช้งานจริงได้ครับ

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhkRTH0zgYKZ0Ulg8kHogwU0CEqUeCGmxTQ5lUzCFDxJBAJXCeSRGhkT8ur5k75jDQIU07RWSQKyCkdY17xDJ_ZRR6lE7zYbBJCDslBozsNhaqZPvtMHFihvxEyC73O7wpYN3Edk9-wjNH7/s559/Test-Map.png

0 ความคิดเห็น:

Post a Comment

Total Pageviews

Twitter Delicious Facebook Digg Stumbleupon Favorites More

 
Design by Maximum Hitech