การทำ hover caption ใน Flash จัดทำโดย : Charoen พิมพ์


บทความนี้จะเป็นการทำ hover caption ใน Flash กันนะครับจะเป็นลักษณะเวลาเราเอาเมาส์ไปชี้ที่วัตถุก็ จะมีข้อความปรากฎขึ้นมาครับ

1. สร้างเอกสารใหม่ขึ้นมาขนาดใดก็ได้ ในที่นี้ขนาด 300x200

2. สร้างปุ่มขึ้นมา หรือไปที่เมนู windows > Common Libraries > Buttons ดังรูป

3. เลือกปุ่มที่ต้องการ แล้วลากลงไปยัง Stage

4. ตั้งชื่อ instance ใน properties ว่า button ดังรูป

5. สร้าง movieclip ขึ้นมา โดยไปที่เมนู Insert > New Symbol หรือกด Ctrl+F8


6. เลือก Type เป็น Movie clip และตั้งชื่อว่า caption

7. ใช้เครื่องมือ Text Tool วาด Textbox ลงไปดังรูป

8. ตั้งชื่อ Instance ใน properties ว่า desc ดังรูป

9. ตกแต่งให้สวยงาม โดยใส่พื้นหลังเข้าไป

10. นำไปวางข้างนอก Stage ดังรูป และตั้งชื่อ Instance ว่า cap

11. สร้างเลเยอร์ใหม่ขึ้นมา

12. ใส่ action ลงไปดังนี้

button.onRollOver = function() {
captionFN(true,"webthaidd.com",this);
this.onRollOut = function() {
captionFN(false);
};
};
captionFN = function (showCaption, captionText, bName) {
if (showCaption) {
_root.createEmptyMovieClip("hoverCaption", this.getNextHighestDepth());
cap.desc.text = captionText;
cap._width = 7*cap.desc.text.length;
cap._alpha = 75;
//
if ((bName._width+bName._x+cap._width)>Stage.width) {
xo = -2-cap._width;
yo = -17;
} else {
xo = 2;
yo = -17;
}
hoverCaption.onEnterFrame = function() {
cap._x = _root._xmouse+xo;
cap._y = _root._ymouse+yo;
cap._visible = true;
};
} else {
delete hoverCaption.onEnterFrame;
cap._visible = false;
}
};

13. กด ctrl+enter เพื่อทดสอบ

คุณอาจสนใจ
เช็คพื้นที่ว่างบนโอส
Zerohate (24,843 - 27 พ.ย. 50)
การเขียน โปรแกรมสร้าง Link List ด้วยภาษา C
langjuko (55,302 - 19 ก.ย. 51)
การทำ Poll ตอนที่ 4 (การสร้าง Set Active ให้กับหัวข้อที่จะโหวด)
Mr.GuruZ (33,848 - 03 มิ.ย. 49)
ปรับแต่ง Sidebar (Vista)
สายลม (16,624 - 26 เม.ย. 51)
เล่นโปรแกรม Winamp แล้วเสียงกระตุกแก้อย่างไร
เว็บไทยดีดี (17,131 - 29 ก.ย. 50)
การทำอักษร 3 มิติ
Lek (46,943 - 27 มิ.ย. 49)
วิธีการโจมตีของแฮกเกอร์มีอะไรบ้าง
เว็บไทยดีดี (19,764 - 03 พ.ย. 50)
วิธีเปลี่ยนเคอร์เซอร์เมาส์ให้เป็นภาพตามใจนึก xp
สายลม (30,324 - 19 เม.ย. 51)