สอนทำ กรอบเลื่อนน่ารักๆ
ใครที่รอทำตอนนี้อยู่มาร์ขอให้ไปทำรูปกรอบเลื่อน่ารักๆไว้ก่อนได้เลยจ้า
หรือจะเอากรอบตัวอย่างที่มาร์ทำไว้ๆไปใช้ก่อนก็ได้น้าา
ในรูปนี้มาร์จะทำกรอบเลื่อนๆ ที่พิมข้อความได้ตรงวงกลมสีขาวจ้าาา
ขั้น 1 เปิดโปรแกรม photoshop cs..อะไรก็ได้ขึ้นมาจ้าา หรือใครจะใช้ ImageReady ก็ได้น่ออ
ขั้น 2 เปิดไม้บรรทัดขึ้นมา สำหรับบ้านใครที่ไม่มี ให้ไปที่แถบ View(อยู่ข้างบนสุดอ่ะ) --> Rulers
แล้วมันจะเป็นแบบนี้ **สังเกตตรงรอบจะมีขีดๆแล้วตัวเลขกำกับ
ขั้นที่ 3 เอาเมาส์ไปกดค้างตรงแถบไม้บรรทัด(ตรงสีขาวๆขีดๆ) แล้วลากเป็น 3*3 ช่องแบบรูปข้างล่างนี้น่ออ
**สังเกต มาร์จะทำช่องตรงที่เราจะทำเป็นกรอบเลื่อนพิมพ์ข้อความได้ไว้ใหญ่หน่อย
ขั้น 4 เลือกเครื่องมือ Rectangular Marquee Tool
มาคลุมครอบตารางในช่องที่ 1 แล้วอ่านค่าความ กว้าง(w) สูง (h) ที่ Info
สำหรับคนที่หา Info ไม่เจอ ให้ไปที่ Window --> Info (F8)
จากนั้นก็จดค่าไว้ แล้วก็คลุมที่ช่องที่ 2-9 แล้วก็จดค่าแต่ละช่องไว้
สำหรับกรอบที่มาร์จะทำนี้มีขนาดเท่านี้ค่ะ
W::151 H::53 | W::113 H::53 | W::56 H::53 |
W::151 H::230 | W::113 H::230 | W::56 H::230 |
W::151 H::97 | W::113 H::97 | W::56 H::97 |
ขั้น 5 หลังจากที่จดค่าทั้ง 9 ช่องแล้วเราจะทำการลงโค้ดกันเลย
<TABLE height=ความสูงของภาพ cellSpacing=0 cellPadding=0 width=ความกว้างของภาพ align=center background=Urlของภาพ border=0> <TBODY> <TR> <TD noWrap width=ช่องที่-1 height=ช่องที่-1> </TD> <TD width=ช่องที่-2 height=ช่องที่-2> </TD> <TD noWrap width=ช่องที่-3 height=ช่องที่-3> </TD></TR> <TR> <TD noWrap width=ช่องที่-4 height=ช่องที่-4> </TD> <TD width=ช่องที่-5 height=ช่องที่-5> <DIV style="SCROLLBAR-FACE-COLOR: #โค้ดสี; SCROLLBAR-HIGHLIGHT-COLOR: #โค้ดสี; OVERFLOW: auto; WIDTH: ช่องที่-5px; SCROLLBAR-SHADOW-COLOR: #โค้ดสี; COLOR: #โค้ดสี; SCROLLBAR-3DLIGHT-COLOR: #โค้ดสี; SCROLLBAR-ARROW-COLOR: #โค้ดสี; SCROLLBAR-DARKSHADOW-COLOR: #โค้ดสี; HEIGHT: ช่องที่-5px" align=center><STRONG></STRONG> <P style="FONT-SIZE: 12px; COLOR: #000000" align=center>พิมพ์ตรงนี้นะจ๊ะ</FONT></P></DIV></TD> <TD noWrap width=ช่องที่-6 height=ช่องที่-6> </TD></TR> <TR> <TD noWrap width=ช่องที่-7 height=ช่องที่-7> </TD> <TD width=ช่องที่-8 height=ช่องที่-8> </TD> <TD noWrap width=ช่องที่-9 height=ช่องที่-9> </TD></TR> </TBODY> </TABLE></FONT> |
เมื่อลงแล้วก็ทำการกดแทรกโค้ดเป็นอันเสร็จ *0*
| | |
| พิมพ์ตรงนี้นะจ๊ะ . . .
Test!!
แจกโค้ดด้วยน่ออ <TABLE height=380 cellSpacing=0 cellPadding=0 width=320align=center background=http://image.ohozaa.com/ig/work1112.jpg border=0> <TBODY> <TR> <TD noWrap width=151 height=53> </TD> <TD width=113 height=53> </TD> <TD noWrap width=56 height=53> </TD></TR> <TR> <TD noWrap width=151 height=230> </TD> <TD width=113 height=230> <DIV style="SCROLLBAR-FACE-COLOR: #ffffff; SCROLLBAR-HIGHLIGHT-COLOR: #ffffff; OVERFLOW: auto; WIDTH:113px; SCROLLBAR-SHADOW-COLOR: #fdc2c4; COLOR: #fdc2c4; SCROLLBAR-3DLIGHT-COLOR: #fdc2c4; SCROLLBAR-ARROW-COLOR: #ffffff; SCROLLBAR-DARKSHADOW-COLOR:#fdc2c4; HEIGHT:230px" align=center><STRONG></STRONG> <P style="FONT-SIZE: 12px; COLOR: #000000" align=center>พิมพ์ตรงนี้นะจ๊ะ</FONT></P></DIV></TD> <TD noWrap width=56 height=230> </TD></TR> <TR> <TD noWrap width=151 height=97> </TD> <TD width=113 height=97> </TD> <TD noWrap width=56 height=97> </TD></TR> </TBODY> </TABLE></FONT> | |
| | |
เครดิต :
ความคิดเห็น