Hello!!!.. New Friends Come .Some Friends Leave. Hope You keep me into your heart.As i keepyou in mine. I willnever forget you. Promise .
Group Blog
lozocat
lozocat
lozocat
lozocat
lozocat
lozocat
lozocat

lozocat
lozocat
lozocat
lozocat
lozocat
lozocat
lozocat
lozocat
lozocat
Group Blog
 
<<
ตุลาคม 2553
 
 12
3456789
10111213141516
17181920212223
24252627282930
31 
 
4 ตุลาคม 2553
 
All Blogs
 
รวมโคดที่จำเป็นสำหรับการแต่งบล้อค(จัดรวมใหม่)


สวัสดีค่ะ...วันนี้ได้รวบรวมโคดที่จำเป็นสำหรับการแต่งบล้อคมาฝาก...
และขอขอบคุณสำหรับโคดบางส่วนที่นำมาจาก บล็อคป้ามด และ บล็อคคุณไหม ค่ะ



Create Date : 04 ตุลาคม 2553
Last Update : 23 ตุลาคม 2554 1:44:56 น. 24 comments
Counter : 8685 Pageviews.
Share

 
เกี่ยวกับตัวพิมพ์

Bold Text
<b>Bold Text</b>
Italic Text
<i>Italic Text</i>
Underlined Text
<u>Underlined Text</u>
Striked-Out Text
<strike>Striked-Out Text</strike>
Sub Script Text
<sub>Sub Script Text </sub>
Super Script Text
<sup>Super Script</sup>
Popular special characters to use in text
 ® = &reg; « = &laquo; » = &raquo; º = &ordm;
♥ = &hearts;· = &middot;© = &copy;™ = &trade;
Names of popular fonts
<font face="Georgia">Georgia</font>
andale mono,times - arial black,avant garde - book antiqua,palatino - comic sans ms,sand - courier new,courier - georgia,palatino - helvetica - impact,chicago - tahoma,arial,helvetica,sans-serif - terminal,monaco - times new roman,times - trebuchet ms,geneva - verdana,geneva -
symbol = symbol
webdings = webdings
wingdings,zapfdingbats = wingdings,zapfdingbats
สีของตัวพิมพ์
<font color="#ff69b4">..เขียนข้อความที่ต้องการ..</font>
ใส่ขนาด ของตัวพิมพ์
<font size="2">..เขียนข้อความที่ต้องการ..</font>
font sizes: 1 2 3 4 5 6 7
ระยะห่างระหว่างตัวพิมพ์
<font style="letter-spacing:2px">..เขียนข้อความที่ต้องการ..</font>
ถ้าต้องการแบบชิดให้ใส่ ลบ นำหน้าหมายเลข
<font style="letter-spacing:-1px">..เขียนข้อความที่ต้องการ..</font>
แบบใส่พื้นหลังให้เฉพาะข้อความที่เราต้องการ
<span style="background-color: #f7f3ff">..เขียนข้อความที่ต้องการ..</span>
อยู่มุม ขวา
<p align="right">อยู่มุม ขวา</p>
อยู่ ตรงกลาง
<p align="center">อยู่มุม ขวา</p>
อยู่มุม ซ้าย
<p align="left">อยู่มุม ซ้าย </p>


โดย: lozocat วันที่: 4 ตุลาคม 2553 เวลา:14:08:33 น.  

 
เกี่ยวกับรูปภาพ

ใส่รูป
<img src="...ใส่..//..ของรูป..." border="0" />
ใส่รูปแบบกำหนด ความกว้าง x ความยาว
<img src="...ใส่..//..ของรูป..." border="0" width="31" height="19"/>

ใส่ข้อความให้กับรูป
<img src="...ใส่..//..ของรูป..." border="0" alt="..เขียนข้อความที่ต้องการ..">
ใส่คำสั่งให้รูปอยู่ในมุมที่ต้องการ right center left
<img src="...ใส่..//..ของรูป..." border="0" align="center">
ทำลิงค์ที่เปิดในหน้าเดียวกัน
<A href="...ใส่..//..ของเวป...">..เขียนข้อความที่ต้องการ..</A>
ทำลิงค์ที่เปิดอีกหน้านึง
<a href="...ใส่..//..ของเวป..." target="_blank">..เขียนข้อความที่ต้องการ..</a>
เอารูปมาทำเป็นลิงค์
<a href="...ใส่..//..ของเวป..." target="_blank"><img src="...ใส่..//..ของรูป..." border="0" ></a>
โคดห้อยหน้าคอม
<img src="..ใส่..//..ของรูป.." style="position: absolute; left: 0; top: 0;">
อธิบายโคด**
●กำหนดให้ตัวห้อยอยู่ในมุม ซ้าย(left) หรือ ขวา(right) และกำหนดระยะห่างจากขอบทั้ง ซ้าย และ ขวา ของหน้าคอม
●ระยะจากขอบของกน้าคอม จากบนลงมาล่าง
กำหนดระยะห่างใส่ตัวเลขได้ตามความต้องการค่ะ ใส่มากห่างมาก
เว้นระยะห่างระหว่างรูป-ใส่มากห่างมาก
&nbsp;
ตัวอย่าง **ใส่มากห่างมาก
<img src="//i1038.photobucket.com/albums/a464/cathk/Small-gif/090123wd_m_j1.gif" border="0" />&nbsp; &nbsp; &nbsp;<img src="//i1038.photobucket.com/albums/a464/cathk/Small-gif/090123wd_m_j1.gif" border="0" />
ก็จะได้ **
     
เว้นบรรทัดของรูป-ใส่มากห่างมาก
<br>
ตัวอย่าง **ใส่มากห่างมาก
<img src="//i1038.photobucket.com/albums/a464/cathk/Small-gif/090123wd_m_j1.gif" border="0" /><br><br><img src="//i1038.photobucket.com/albums/a464/cathk/Small-gif/090123wd_m_j1.gif" border="0" />
ก็จะได้ **


Borders ให้กับรูป
<img style="border-style: solid; border-width: 1px; border-color: #ff69b4" src="..ใส่..//..ของรูป.."> 
อธิบายโคด**
●ใส่ชนิด ของ border ใส่ขนาด ใส่สี
ชื่อขนิดของ Borders
2px solid
2px dashed
2px dotted
2px groove
2px ridge
5px double
2px outset
2px inset
ตัวอย่าง **


โดย: lozocat วันที่: 4 ตุลาคม 2553 เวลา:14:09:35 น.  

 
เกี่ยวกับพืเนหลัง**
สิ่งที่สำคัญ...หากวางแล้วโคดไม่ขึ้น ให้นำไปวางใหม่โดยวางไว้แถวล่างสุดของหน้าที่วางโคด

ใส่พื้นหลังโดยใช้โคดสี
<style>body{background:#fffcf3}></style>
ใส่พื้นหลังแบบTitle
<style>body{background-image:url("..ใส่..//..ของรูป..");}</style>
ทำให้พื้นหลังยึดติดกับที่ไม่เลื่อนตามเม้าท์
<style>body{background-attachment: fixed;}</style>
สำหรับธีม (แบบ สไตล์เกาหลี )
<style type="text/css"><!--body{background:url(..ใส่..//..ของรูป..) repeat center top;background-color:#fffcf3;}--></style>
สำหรับภาพพื้นหลังเพีบงรูปเดียว และ อยู่ติดมุมของหน้าคอม
<style type="text/css"><!--body{background:url(..ใส่..//..ของรูป..) no-repeat fixed left bottom;background-color:#fffcf3;}--></style>
อธิบายโคด**
●กำหนดให้รูปอยู่ในมุมที่ต้องการ
●กำหนดให้รูปอยู่ในแถวที่ต้องการ เช่น แถวบน แถวกลาง หรือ แถวล่าง
●และ อย่าลืมใส่โคดสีให้เหมาะกับรูปด้วยนะคะ
left - มุมซ้ายtop - แถวบน
right - มุมขวาcenter - แถวกลาง
center - กลางbottom - แถวล่าง


โดย: lozocat วันที่: 4 ตุลาคม 2553 เวลา:14:20:33 น.  

 
เกี่ยวกับสคริปเรีย**
สิ่งที่สำคัญ...หากวางแล้วโคดไม่ขึ้น ให้นำไปวางใหม่โดยวางไว้แถวล่างสุดของหน้าที่วางโคด

โค้ดเปลี่ยนรูปแทนรูป ให้ทิป เปิดหมวก
<script>iLength = document.images.length; for(i=0;i<iLength;i++) if(document.images[i].src=="https://www.bloggang.com/images/icon_tip.gif") {document.images[i].src="....ใส่..//..ของรูป...."}</script>
โค้ดเปลี่ยนรูปแทนรูป Rss Feed
<script>iLength = document.images.length; for(i=0;i<iLength;i++) if(document.images[i].src=="https://www.bloggang.com/images/icon_rss.png") {document.images[i].src="....ใส่..//..ของรูป...."}</script>
โค้ดเปลี่ยนรูปแทนรูป ฝากข้อความหลังไมค์
<script>iLength = document.images.length; for(i=0;i<iLength;i++) if(document.images[i].src=="https://www.bloggang.com/images/icon_message.gif") {document.images[i].src="....ใส่..//..ของรูป...."}</script>
โค้ดเปลี่ยนรูปกระดาษ ปากกา ตรงรูปแก้ไข Blog
<script>iLength = document.images.length; for(i=0;i<iLength;i++) if(document.images[i].src=="https://www.bloggang.com/images/iconnote.gif") {document.images[i].src="....ใส่..//..ของรูป....";document.images[i].height="ความสูงของรูป"; document.images[i].width="ความกว้างของรูป";}</script>
โค้ดเปลี่ยนรูปถังขยะ ตรงรูปลบ Comment, ลบ Blog
<script>iLength = document.images.length; for(i=0;i<iLength;i++) if(document.images[i].src=="https://www.bloggang.com/images/delete.gif") {document.images[i].src="....ใส่..//..ของรูป....";document.images[i].height="ความสูงของรูป"; document.images[i].width="ความกว้างของรูป";}</script>
โค้ดเปลี่ยนรูปแทนรูป My FriendFlock
<script>iLength = document.images.length; for(i=0;i<iLength;i++) if(document.images[i].src=="https://www.bloggang.com/images/icon_friends.gif") {document.images[i].src="....ใส่..//..ของรูป...."}</script>
เปลี่ยนรูปแทน รูปหัวใจสีแดงที่อยู่ท้ายชื่อเพื่อนในกล่องคอมเม้น
<script>iLength = document.images.length; for(i=0;i<iLength;i++) if(document.images[i].src=="https://www.bloggang.com/images/smile.gif") {document.images[i].src="....ใส่..//..ของรูป...."}</script>
เปลี่ยนรูปของ bullet ●จุดเล็กๆที่อยู่หน้าหัวข้อ
<style>ul{list-style: ;list-style-image: url(...ใส่..//..ของรูป....);}</style>
ถ้าไม่ต้องการให้มีจุดเล็กๆข้างหน้าหรือรูปอะไรเลย ให้ใส่โคดด้านล่างแทนค่ะ
<style>ul{list-style: ;list-style-image: url(//img153.imageshack.us/img153/7481/lozocat.gif);}</style>
ห้ามคลิก ขวา
<script type="text/javascript" src ="//www.mdn.fm/files/86634_koegw/mouse.js"></script>
อีเมลล์
<a href="mailto:ใส่อีเมล์ของคุณ">เขียนข้อความที่ต้องการ</a>
โค้ดป้องกันการยืดของหน้าบล็อค
<style>div.comment{overflow: auto; width: 400px; height: auto;}</style>
หลังไมค์
<a href ="...ใส่..//....ของหลังไมค์ที่เป็นชื่อคุณ." target='_blank'>เขียนข้อความที่ต้องการ</a>
แบบใส่รูปแทนข้อความ
<a href ="...ใส่..//....ของหลังไมค์ที่เป็นชื่อคุณ." target='_blank'><img src="....ใส่..//..ของรูป...." border="0" /></a>
ตัวอย่างชื่อหลังไมค์
<a href ="//www.pantip.com/cafe/krazip/write.php?nick_name=lozocat" target='_blank'>เมลล์คุยกันโลด</a>
โค้ด กลับขึ้นข้างบนของ Page
<center><a href="#top">TOP</a></center>
ตัวอย่าง
TOP
ข้อความต้อนรับเมือเปิดหน้าเวป
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
alert("เขียนข้อความที่ต้องการร")
// End -->
</script>
ข้อความบอกลา
<Script Language="VBScript"> Sub Window_onUnLoad() alert("เขียนข้อความที่ต้องการ") End Sub </Script>
ทำกรอบรอบๆบล็อค
<style>body{border: 10px ridge #FF7CA8 ;}</style>
ลูกเล่นเมื่อเปลี่ยน Webpage
<Meta http-equiv="Page-Enter" content="RevealTrans (Duration=3, Transition=23)">
<Meta http-equiv="Page-Exit" content="RevealTrans (Duration=2, Transition=23)">
โคดลบกรอบสีขาว
<style>table {background-color:
transparent;border-style: none;border-spacing: none;}td
{border: none;border-color: none;background: none;}</style>


โดย: lozocat วันที่: 4 ตุลาคม 2553 เวลา:14:23:07 น.  

 
ขอบคุณมากค่ะคุณแคท


โดย: kobnon วันที่: 4 ตุลาคม 2553 เวลา:14:27:22 น.  

 
เกี่ยวกับสคริปเรีย และ กล่องใส่ข้อความคอมเม้น
สิ่งที่สำคัญ...หากวางแล้วโคดไม่ขึ้น ให้นำไปวางใหม่โดยวางไว้แถวล่างสุดของหน้าที่วางโคด

ใส่โลโก้ บล็อคแก๊ง
<script>document.images[0].src = "....ใส่..//..ของรูป...."</script>
จำนวนผู้ชมทั้งหมด
<script src="//fastwebcounter.com/secure.php?s=....ใส่..//..ของบล็อกคุณ...."></script>เขียนข้อความที่ต้องการ
เพื่อนที่กำลังเยี่ยมชมบล็อกขณะนี้มีกี่คน
<script type="text/javascript" src="//fastonlineusers.com/on4.php?d=....ใส่..//..ของบล็อกคุณ...."></script>เขียนข้อความที่ต้องการ 
ตัวอย่าง
<script type="text/javascript" src="//fastonlineusers.com/on4.php?d=//misscat.bloggang.com"</script>เพื่อนที่กำลังชมบล็อก
ลด และ เพิ่ม ขนาดตัวพิมพ์ทั้งหน้าเวป + สีของตัวพิมพ์
<style>body, ul, li, p{font:bold MS Sans Serif;font-size:12pt;color:#ff0000;}</style>
กรอบนับ Comment โดยคุณ กึ่งยิงกึ่งผ่าน
<script>HTML = document.body.innerHTML; CommentCount = 0; var reg = new RegExp("-- Comment", "gm"); while(reg.test(HTML)) CommentCount++; CommentCount--; for(i=1; i<=CommentCount; i++){ originalHtml = document.getElementById( i ).innerHTML; beforeHtml = '<fieldset style="border:#819fb7 dashed 1px; padding: 2px"><legend align="right" style="border: #819fb7 dashed 1px; padding: 3px; background: #f3fffc"><font size="2" color="#990000">เขียนข้อความต้อนรับ ' + i + ' </font><img src=ใส่..//..ของรูป ></font></legend>';document.getElementById( i ).innerHTML = beforeHtml + originalHtml;}</script>
อธิบายการแก้ไขคำสั่งของพิมพ์สีที่ จขบกำกับไว้นะคะ**
●ใส่ขนาดให้เส้นรอยปะ ใส่ชื่อให้เส้นรอยปะ ใส่สีให้รอยปะ(dashed คือชื่อของเส้นที่เป็นรอยปะ)
●วางตำแหน่องข้อความต้อนรับอยู่ในมุมที่ต้องการ คือ left center right
●ใส่สีให้เส้นกรอบ ใส่ชื่อชนิดกรอบ ใส่ขนาดของเส้นกรอบ และใส่พืเนหลัง ให้กับช่องที่เขียนข้อความต้อนรับ
●ใส่ขนาดข้อความ และ ใส่สีข้อความต้อนรับ
ตัวอย่างของกล่องสำหรับเพื่อนที่ไม่เข้าใจคำสั่งนะคะ
คนน่ารักแวะมาทักทายคนที่ 1
แวะมาทักทายจ้า...
โดย: lozocat วันที่: 10 กันยายน 2551 เวลา:6:37:27 น.
หรือแบบที่มีลูกเล่นน่ารักๆ คลิกที่ลิงค์ด้านล่างค่ะ
●กล่องใส่ข้อความคอมเม้นแบบที่มีระบาย
●กล่องใส่ข้อความคอมเม้นแบบมีกล่องเล็กๆใส่ตัวนับจำนวนคอมเม้น


โดย: lozocat วันที่: 4 ตุลาคม 2553 เวลา:14:31:30 น.  

 
เกี่ยวกับสคริปเรีย กล่องเขียนข้อความคอมเม้น
สิ่งที่สำคัญ...หากวางแล้วโคดไม่ขึ้น ให้นำไปวางใหม่โดยวางไว้แถวล่างสุดของหน้าที่วางโคด

ใส่พื้นหลังให้กล่องคอมเม้น
<style>textarea{width: 400;height: 320;background: url(....ใส่..//..ของรูปพื้นหลัง...);color: #FF69B4;font-family: MS Sans Serif;font-size:15pt;border: dashed 1px #FF69B4;}input{background: #FFF694;color: #402840;border: 1px dashed #FF69B4;}</style>
อธิบายการแก้ไขคำสั่งของพิมพ์สีที่ จขบกำกับไว้นะคะ**
●ใส่ขนาดความกว้าง × ความสูง ของรูปพื้นหลัง
●สีเขียนคอมเม้นม้-ใส่ชื่อของตัวพิมพ์-ใส่ขนาดของตัวพิมพ์
●ใส่ขนาดให้เส้นรอยปะ ใส่ชื่อให้เส้นรอยปะ ใส่สีให้รอยปะ(dashed คือชื่อของเส้นที่เป็นรอยปะ)
●สีพื้นหลัง(พื้นที่เป็นสีเหลืองช่องสำหรับใส่ชื่อคนคอมเม้น)ใส่สีให้ตัวพิมพ์
●ขนาดของเส้นรอยปะ (ช่องสีเหลือง)ใส่ชนิดให้เส้นรอยปะ ใส่ให้สีให้เส้นรอยปะ ( dashed คือชื่อของเส้นรอยปะ)
ตัวอย่างของกล่องสำหรับเพื่อนที่ไม่เข้าใจคำสั่งนะคะ
ชื่อ :
สีพิมพ์ชื่อคนคอมเม้น* lozocat
สีของข้อความคอมเม้น
กรอบและเปลี่ยนข้อความแทน Submit และ Reset
ตัวอย่างของกล่องสำหรับเพื่อนที่ไม่เข้าใจคำสั่งนะคะ
SubmitReset
<script>
document.forms.reply.Submit.value = "Submit";
document.forms.reply.Reset.value = "Reset";
document.forms.reply.Submit.style.width = 100;
document.forms.reply.Reset.style.width = 100;
document.forms.reply.Submit.style.height = 30;
document.forms.reply.Reset.style.height = 30;
document.forms.reply.Submit.style.backgroundColor = "#F8EFEC";
document.forms.reply.Reset.style.backgroundColor = "#F8EFEC";
document.forms.reply.Submit.style.color = "#e65c7c";
document.forms.reply.Reset.style.color = "#e65c7c";
document.forms.reply.Submit.style.border = "2px solid #ff0000";
document.forms.reply.Reset.style.border = "2px solid #ff0000";
</script> 
อธิบายการแก้ไขคำสั่งของพิมพ์สีที่ จขบกำกับไว้นะคะ**
●เขียนข้อความแทนข้อความ Submit  เขียนข้อความแทนข้อความ Reset
●ใส่ขนาดความกว้าง  ให้กับช่องทั้ง 2 ช่อง
●ใส่ขนาดความสูงให้กับช่องทั้ง 2 ช่อง
●ใส่สีให้กับพื้นหลังทั้ง 2 ช่อง
●สีตัวพิมพ์ที่เขียนของทั้ง 2 ช่อง
●ใส่ขนาด และใส่สี เส้นขอบของช่องทั้ง 2 ช่อง (dashed คือชื่อของเส้นรอยปะ)


โดย: lozocat วันที่: 4 ตุลาคม 2553 เวลา:14:36:58 น.  

 
เกี่ยวสีลิงค์ และ สีตัวพิมพทั้งหน้าเวป
สิ่งที่สำคัญ...หากวางแล้วโคดไม่ขึ้น ให้นำไปวางใหม่โดยวางไว้แถวล่างสุดของหน้าที่วางโคด

Mouse ชี้ที่ Link แล้วเป็นสีรุ้ง
<script type="text/javascript" src ="//www.mdn.fm/files/86638_i5ytv/link.js"></script>
เซตจัดสี ตัวพิมพ์ สีของลิงค์
<style type="text/css"> <!--body { color: #cc6699; background-color:#ffffff ;}a:link {color: #5b88ba;}a:visited {color: #986cc2;}a:active {color: #6b75ff;}--></style>
อธิบายการแก้คำสั่ง ของพิมพ์สีที่ จขบ.กำกับไว้
●bgcolor...#ffffff  ใส่สีให้พื้นหลัง
●fontcolor...#cc6699 สีของตัวพิมพ์
●linkcolor...#5b88ba สีของลิงค์
●vlinkcolor...#986cc2 สีของลิงค์เมื่อผ่านการคลิกไปแล้ว
●activecolor...#6b75ff สีกระพริบเมื่อวางเมาท์ที่ลิงค์
หรือจะเอาแบบที่จัดมาแบบเป็นเซตๆได้ที่้มนูด้านล่างค่ะ
โทนสีม่วงโทนสีแดง
โทนสีส้มโทนสีพาสเทล
โทนสีเทาดำโทนสีเหลือง
โทนสีชมพูโทนสีฟ้า
โทนสีน้ำเงินโทนสีเขียว
โทนสีคลาสสิคโทนสีอมเทา
โทนสีพื้นหลังขาวโทนสีสี่ฤดู
สีเอิร์ธโทนโทนสีเบ็ดเตล็ด


โดย: lozocat วันที่: 4 ตุลาคม 2553 เวลา:14:38:59 น.  

 
สัญลักษณ์แบบต่างๆของเม้าท์เมื่อวางบนลิงค์
สิ่งที่สำคัญ...หากวางแล้วโคดไม่ขึ้น ให้นำไปวางใหม่โดยวางไว้แถวล่างสุดของหน้าที่วางโคด

ลองเอาเม้ามาวางที่นี่ดูค่ะ
<style>A:hover {BACKGROUND-IMAGE: url(); CURSOR: help; COLOR: Red; BACKGROUND-COLOR: #; TEXT-DECORATION: none}</style>
ลองเอาเม้ามาวางที่นี่ดูค่ะ
<style>A:hover {BACKGROUND-IMAGE: url(); CURSOR: move; COLOR: Red; BACKGROUND-COLOR: #; TEXT-DECORATION: none}</style>
ลองเอาเม้ามาวางที่นี่ดูค่ะ
<style>A:hover {BACKGROUND-IMAGE: url(); CURSOR: wait; COLOR: Red; BACKGROUND-COLOR: #; TEXT-DECORATION: none}</style>
ลองเอาเม้ามาวางที่นี่ดูค่ะ
<style>A:hover {BACKGROUND-IMAGE: url(); CURSOR: text; COLOR: Red; BACKGROUND-COLOR: #; TEXT-DECORATION: none}</style>
ลองเอาเม้ามาวางที่นี่ดูค่ะ
<style>A:hover {BACKGROUND-IMAGE: url(); CURSOR: crosshair; COLOR: Red; BACKGROUND-COLOR: #; TEXT-DECORATION: none}</style>
ลองเอาเม้ามาวางที่นี่ดูค่ะ
<style>A:hover {BACKGROUND-IMAGE: url(); CURSOR: nw-resize; COLOR: Red; BACKGROUND-COLOR: #; TEXT-DECORATION: none}</style>
ลองเอาเม้ามาวางที่นี่ดูค่ะ
<style>A:hover {BACKGROUND-IMAGE: url(); CURSOR: w-resize; COLOR: Red; BACKGROUND-COLOR: #; TEXT-DECORATION: none}</style>
ลองเอาเม้ามาวางที่นี่ดูค่ะ
<style>A:hover {BACKGROUND-IMAGE: url(); CURSOR: sw-resize; COLOR: Red; BACKGROUND-COLOR: #; TEXT-DECORATION: none}</style>
ลองเอาเม้ามาวางที่นี่ดูค่ะ
<style>A:hover {BACKGROUND-IMAGE: url(); CURSOR: s-resize; COLOR: Red; BACKGROUND-COLOR: #; TEXT-DECORATION: none}</style>
ลองเอาเม้ามาวางที่นี่ดูค่ะ
<style>A:hover {BACKGROUND-IMAGE: url(); CURSOR: se-resize; COLOR: Red; BACKGROUND-COLOR: #; TEXT-DECORATION: none}</style>
ลองเอาเม้ามาวางที่นี่ดูค่ะ
<style>A:hover {BACKGROUND-IMAGE: url(); CURSOR: e-resize; COLOR: Red; BACKGROUND-COLOR: #; TEXT-DECORATION: none}</style>
ลองเอาเม้ามาวางที่นี่ดูค่ะ
<style>A:hover {BACKGROUND-IMAGE: url(); CURSOR: ne-resize; COLOR: Red; BACKGROUND-COLOR: #; TEXT-DECORATION: none}</style>
ลองเอาเม้ามาวางที่นี่ดูค่ะ
<style>A:hover {BACKGROUND-IMAGE: url(); CURSOR: n-resize; COLOR: Red; BACKGROUND-COLOR: #; TEXT-DECORATION: none}</style>


โดย: lozocat วันที่: 4 ตุลาคม 2553 เวลา:14:40:57 น.  

 
เกี่ยวกับ แถบสีน้ำเงินด้านบนสุดของหน้าคอม
สิ่งที่สำคัญ...หากวางแล้วโคดไม่ขึ้น ให้นำไปวางใหม่โดยวางไว้แถวล่างสุดของหน้าที่วางโคด

ข้อความนี้จะขึ้นที่แถบสีน้ำเงินด้านบนสุดของหน้าคอมค่ะ
<script>window.document.title=".เขียนข้อความที่นี่ .";</script>
บอกวัน-เดือน-ปี-และเวลาเป็นภาษาไทยที่ไตเติ้ลบาร์..
<!-- Begin
function clock() {
var date = new Date()
var year = date.getYear()
var month = date.getMonth()
var day = date.getDate()
var hour = date.getHours()
var minute = date.getMinutes()
var second = date.getSeconds()
var months = new Array("", "มกราคม", "กุมภาพันธ์", "มีนาคม", "เมษายน", "พฤษภาคม", "มิถุนายน", "กรกฎาคม", "สิงหาคม", "กันยายน", "ตุลาคม", "พฤศจิกายน", "ธันวาคม")

var monthname = months[month]

if (hour > 12) {
hour = hour - 12
}

if (minute < 10) {
minute = "0" + minute
}

if (second < 10) {
second = "0" + second
}


document.title = "ขณะนี้ : เดือน " + monthname + " วันที่ " + day + "  ปี ค.ศ. " + year + "  เวลา " + hour + ":" + minute + ":" + second

setTimeout("clock()", 1000)

}
//  End -->
ก็อปปี๊โคดในสกอร์บ็อกด้านบนมาวางไว้ที่ จาวา โคดด้านล่างค่ะ**
<SCRIPT LANGUAGE="JavaScript">
..ใส่โคดในกล่องสกอร์บ็อกที่นี่..
</script>
<body on+Load="clock()"  >
</body>
และ ก่อนที่จะนำโคดไปวางให้ลบเครื่องหมาย + ในแท๊กบอดี้ ที่เห็นด้านบนออกก่อนนะคะ
มีอักษรขึ้นมาทีละตัวที่ไตเติ้ลบาร์ค่ะ
var message="..เขียนข้อความที่นี่ ."     //specifys the title
var message=message+"          " //gives a pause at the end,1 space=1 speed unit, here I used 10 spaces@150 each = 1.5seconds.
i="0"                     //declares the variable and sets it to start at 0
var temptitle=""                 //declares the variable and sets it to have no value yet.
var speed="150"                  //the delay in milliseconds between letters

function titler(){
if (!document.all&&!document.getElementById)
return
document.title=temptitle+message.charAt(i)  //sets the initial title
temptitle=temptitle+message.charAt(i)       //increases the title by one letter
i++                        //increments the counter
if(i==message.length)                //determines the end of the message
{
i="0"                        //resets the counter at the end of the message
temptitle=""                    //resets the title to a blank value
}
setTimeout("titler()",speed)            //Restarts. Remove line for no-repeat.
}
ก็อปปี๊โคดในสกอร์บ็อกด้านบนมาวางไว้ที่ จาวา โคดด้านล่างค่ะ**
<script language="JavaScript1.2">
..ใส่โคดในกล่องสกอร์บ็อกที่นี่..
window.on+load=titler
</script>
และ ก่อนที่จะนำโคดไปวางให้ลบเครื่องหมาย + ในแท๊กบอดี้ ที่เห็นด้านบนออกก่อนนะคะ


โดย: lozocat วันที่: 4 ตุลาคม 2553 เวลา:14:43:23 น.  

 
เกี่ยวกับ แถบสีน้ำเงินด้านบนสุดของหน้าคอม
สิ่งที่สำคัญ...หากวางแล้วโคดไม่ขึ้น ให้นำไปวางใหม่โดยวางไว้แถวล่างสุดของหน้าที่วางโคด

แสดงเวลาว่าคุณอยู่หน้านี้นานเท่าไหร่ที่ไตเติ้ลบาร์
var d_title="...คุณเข้าหน้านี้มาเป็นเวลา : "
var get_time
//get the login time
var login_h=new Date()
var login_ms=login_h.getTime()
function get_current_time(){
var one_sec=1000
current_time=new Date()
current_time.getTime()
//hold the login time of the user
var login_time=Math.floor((current_time-login_ms)/one_sec)
document.title=d_title+" "+login_time+" "+"วินาที"
//if he pass the minute
if  (login_time>60){
var m=Math.floor(login_time/60)
var s=login_time%60
document.title=d_title+" "+m+" "+"นาที "+s+" "+"วินาที"
 }
}
function loop_time() {
setInterval("get_current_time()",100)
}
ก็อปปี๊โคดในสกอร์บ็อกด้านบนมาวางไว้ที่ จาวา โคดด้านล่างค่ะ**
<SCRIPT LANGUAGE="JavaScript">
..ใส่โคดในกล่องสกอร์บ็อกที่นี่..
window.on+load =loop_time
-->
</script>
และ ก่อนที่จะนำโคดไปวางให้ลบเครื่องหมาย + ในแท๊กบอดี้ ที่เห็นด้านบนออกก่อนนะคะ
ข้อความที่เราเขียนเปลี่ยนไปเรื่อยๆที่ไตเติ้ลบาร์
var tt = 0;
var FMess = new Array("ข้อความที่ 1","ข้อความที่ 2","ข้อความที่ 3")

function FTitle()
    {
    document.title = FMess[tt]
    tt = (tt < (FMess.length -1)) ? tt + 1 : 0;
    setTimeout('FTitle()',700);
    }
FTitle();
ก็อปปี๊โคดในสกอร์บ็อกด้านบนมาวางไว้ที่ จาวา โคดด้านล่างค่ะ**
<SCRIPT LANGUAGE="JavaScript">
..ใส่โคดในกล่องสกอร์บ็อกที่นี่..
</script>
และ ก่อนที่จะนำโคดไปวางให้ลบเครื่องหมาย + ในแท๊กบอดี้ ที่เห็นด้านบนออกก่อนนะคะ
ข้อความที่เราเขียนวิ่งไปเรื่อยๆทไตเติ้ลบาร์
<!-- Begin
var scrl = " .เขียนข้อความที่นี่.";
function scrlsts() {
 scrl = scrl.substring(1, scrl.length) + scrl.substring(0, 1);
 document.title = scrl;
 setTimeout("scrlsts()", 300);
 }
//  End -->
ก็อปปี๊โคดในสกอร์บ็อกด้านบนมาวางไว้ที่ จาวา โคดด้านล่างค่ะ**
<SCRIPT LANGUAGE="JavaScript">
..ใส่โคดในกล่องสกอร์บ็อกที่นี่..
</script>
</head>
<BODY on+Load="scrlsts()" >
</body>
และ ก่อนที่จะนำโคดไปวางให้ลบเครื่องหมาย + ในแท๊กบอดี้ ที่เห็นด้านบนออกก่อนนะคะ


โดย: lozocat วันที่: 4 ตุลาคม 2553 เวลา:14:44:26 น.  

 
เกี่ยวกับ ลูกเล่นต่างๆ
สิ่งที่สำคัญ...หากวางแล้วโคดไม่ขึ้น ให้นำไปวางใหม่โดยวางไว้แถวล่างสุดของหน้าที่วางโคด

Menu จาวาสคริป สวยๆทั้งนั้นค่ะ
สคริปใบไม้ร่วงหน้าบล็อก
สคริปหัวใจหลายสีร่วงหน้าบล็อก
สคริปทำตัวอักษรติดเม้าท์
สคริปดุ๊กดิ๊กเดินเล่นหน้าคอม
สคริปเปลี่ยนลิงค์ให้มีสีสันต์เวลาเอาเม้าท์ไปชี้1
สคริปเปลี่ยนลิงค์ให้มีสีสันต์เวลาเอาเม้าท์ไปชี้2
สคริปฟองอากาศลอยขึ้นมาหน้าคอม
สคริปลูกบอลเล็กๆหลายสีเด้งตามเม้าท์
สคริป "ทำตัวการ์ตูนติดเม้าท์"น่ารัก
สคริปพื้นหลังค่อยๆเปลี่ยสีไปเรื่อยๆ
สคริปหนู2ตัวแข่งรถหน้าคอม
สคริปลูกไก่เดินตามเม้าท์
สคริปดาวร่วงหน้าบล็อก


โดย: lozocat วันที่: 4 ตุลาคม 2553 เวลา:14:45:42 น.  

 

สร้างกรอบแบบที่ใช้บ่อยๆ 1
<table border="0" cellspacing="0" cellpadding="3" width="320" align="center" style="background-color: #d8d0b8">  <tbody><tr><td align="center" valign="middle" style="color: #500000; border: 2px dashed #500000">............เขียนข้อความ..........</td></tr></tbody> </table> 
อธิบายการแก้ไขคำสั่งของพิมพ์สีที่ จขบ.กำกับไว้นะคะ**
●ใส่สีพื้นหลังให้กรอบข้อความ
●ใส่สีให้กับข้อความ
●ใส่สีให้กับเส้นกรอบ (เส้นรอยปะ)
ชื่อขนิดของ Borders
2px solid
2px dotted
2px dashed
2px groove
2px ridge
3px double
3px outset
3px inset
สร้างกรอบแบบที่ใช้บ่อยๆ 2
<table border="0" cellspacing="0" cellpadding="3" width="320" align="center" style="border: 2px dashed #500000"> <tbody><tr><td align="center" valign="middle" style="color: #500000; background-color: #d8d0b8">......เขียนข้อความ......</td></tr></tbody> </table> 
อธิบายการแก้ไขคำสั่งของพิมพ์สีที่ จขบ.กำกับไว้นะคะ**
●ใส่สีพื้นหลังให้กรอบข้อความ
●ใส่สีให้กับข้อความ
●ใส่สีให้กับเส้นกรอบ (เส้นรอยปะ)
ชื่อขนิดของ Borders
2px solid
2px dotted
2px dashed
2px groove
2px ridge
3px double
3px outset
3px inset


โดย: lozocat วันที่: 4 ตุลาคม 2553 เวลา:18:07:29 น.  

 
สร้างกรอบแบบที่ใช้บ่อยๆ 3
<table border="0" cellspacing="3" cellpadding="3" width="320" align="center" style="background-color: #66ccff">  <tbody><tr><td align="center" valign="middle" style="color: #ffffff; border: 3px double #ffffff ">........เขียนข้อความ......</td></tr></tbody> </table> 
อธิบายการแก้ไขคำสั่งของพิมพ์สีที่ จขบ.กำกับไว้นะคะ**
●ใส่สีพื้นหลังให้กรอบข้อความ
●ใส่สีให้กับข้อความ
●ใส่สีให้กับเส้นกรอบ
ชื่อขนิดของ Borders
2px solid
2px dotted
2px dashed
2px groove
2px ridge
3px double
2px outset
2px inset
แบบที่ใส่ 2 เส้นคู่กัน
<table border="0" cellspacing="3" cellpadding="3" width="320" align="center" style="border: 2px dotted #c875a; background-color: #fff0f5f">  <tbody><tr><td align="center" valign="middle" style="color: #c875a5; border: 2px dotted #c875a5">.......เขียนข้อความ.......</td></tr></tbody> </table> 
อธิบายการแก้ไขคำสั่งของพิมพ์สีที่ จขบ.กำกับไว้นะคะ**
●ใส่สีพื้นหลังให้กรอบข้อความ
●ใส่สีให้กับข้อความ
●ใส่สีให้กับเส้นกรอบทั้ง สองเส้น
ชื่อขนิดของ Borders
2px solid
2px dashed
2px dotted
2px groove
2px ridge
3px double
3px outset
3px inset
หรือจะใส่สลับสีกันก็ได้ค่ะ
2px solid
2px dashed
2px dotted
2px groove
2px ridge
3px double
3px outset
3px inset


โดย: lozocat วันที่: 4 ตุลาคม 2553 เวลา:18:08:23 น.  

 
ตัวอย่างโคดสี ในช่องตารางจะมีโคดสีซ่อนอยู่
#EAECF4#ECF4EE#ECF4F9
#FFF4F8#F1EDF3#EFF8F5
#F1EDF3#FFF4F7#F4F8EF
#D8BFD8#EEE9E9#CDC9C9
#8B8989#EEE5DE#FFFAFA
#CDC5BF#FFF5EE#FFEFDB
#EEDFCC#CDC0B0#8B8378
#FFE4C4#CDB79E#8B7D68
#A8D0E8#98CCD0
#F8B4B8
#8098B8#A0B8A8#F0C898
#C8A8B0#A8D8F8#A0A4A8
#989898#D8CCB0#E8D0D0
#C0BCFF#F9C6F8#FFCDB5


โดย: lozocat วันที่: 4 ตุลาคม 2553 เวลา:18:09:14 น.  

 
ลูกเล่นกรอบเขียนข้อความแบบต่างๆ ที่ จขบ.พอจะนึกออก .3

สร้างกรอบแบบง่ายๆ 8
<table border="0" cellspacing="0" cellpadding="0" width="100%" align="center">  <tbody><tr><td style="width: 5px; background-color: #CDC0B0; height: 6px"><img src="//img821.imageshack.us/img821/7481/lozocat.gif" border="0" /></td><td style="background-color:#CDC0B0"></td><td></td></tr><tr><td style="background-color: #CDC0B0"></td><td align="center" valign="middle" style="padding: 7px; background-color: #FFE4E1">............เขียนข้อความ..........</td><td style="background-color: #FFE4E1"></td></tr><tr><td></td><td style="background-color: #FFE4E1"></td><td style="width: 5px; height: 5px; background-color: #FFE4E1"><img src="//img821.imageshack.us/img821/7481/lozocat.gif" border="0" /></td></tr></tbody> </table>  
อธิบายการแก้ไขคำสั่งของพิมพ์สีที่ จขบกำกับ
กำหนดให้กรอบอยู่มุม left center right
และ ใส่ขนาดให้กรอบ
ใส่สีให้เงาของกรอบ
ใส่สีให้พื้นหลัง
สร้างกรอบแบบง่ายๆ 9
<table border="0" cellspacing="0" cellpadding="0" width="100%" align="center">  <tbody><tr><td></td><td style="background-color: #F1EDF3"></td><td style="width: 5px; height: 5px; background-color: #F1EDF3"><img src="//img821.imageshack.us/img821/7481/lozocat.gif" border="0" /></td></tr><tr><td style="background-color: #CDC0B0"></td><td align="center" valign="middle" style="padding: 7px; background-color: #F1EDF3">............เขียนข้อความ..........</td><td style="background-color: #F1EDF3"></td></tr><tr><td style="width: 5px; height: 5px; background-color: #CDC0B0"><img src="//img821.imageshack.us/img821/7481/lozocat.gif" border="0" /></td><td style="background-color: #CDC0B0"></td><td></td></tr></tbody> </table>
อธิบายการแก้ไขคำสั่งของพิมพ์สีที่ จขบกำกับ
กำหนดให้กรอบอยู่มุม left center right
และ ใส่ขนาดให้กรอบ
ใส่สีให้เงาของกรอบ
ใส่สีให้พื้นหลัง
สร้างกรอบแบบง่ายๆ 10
<table border="0" cellspacing="0" cellpadding="0" width="100% " align="center"><tbody><tr><td></td><td style="background-color: #CDC0B0"></td><td style="width: 5px; height: 5px; background-color: #CDC0B0"><img src="//img821.imageshack.us/img821/7481/lozocat.gif" border="0" /></td></tr><tr><td style="background-color: #EAECF4"></td><td align="center" valign="middle" style="padding: 7px; background-color: #EAECF4">............เขียนข้อความ..........<br /></td><td style="background-color: #CDC0B0"></td></tr><tr><td style="background-color: #EAECF4; width: 5px; height: 5px"><img src="//img821.imageshack.us/img821/7481/lozocat.gif" border="0" /></td><td style="background-color: #EAECF4"></td><td></td></tr></tbody></table>
อธิบายการแก้ไขคำสั่งของพิมพ์สีที่ จขบกำกับ
กำหนดให้กรอบอยู่มุม left center right
และ ใส่ขนาดให้กรอบ
ใส่สีให้เงาของกรอบ
ใส่สีให้พื้นหลัง
สร้างกรอบแบบง่ายๆ 11
<table border="0" cellspacing="0" cellpadding="0" width="100%"  align="center">  <tbody><tr><td style="background-color: #FFFACD"></td><td style="background-color: #FFFACD"></td><td style="width: 5px; height: 5px"><img src="//img821.imageshack.us/img821/7481/lozocat.gif" border="0" /></td></tr><tr><td style="background-color: #FFFACD"></td><td align="center" valign="middle" style="padding: 7px; background-color: #FFFACD">............เขียนข้อความ..........</td><td style="background-color: #CDC0B0"></td></tr><tr><td style="width: 5px; height: 5px"><img src="//img821.imageshack.us/img821/7481/lozocat.gif" border="0" /></td><td style="background-color: #CDC0B0"></td><td style="background-color: #CDC0B0"></td></tr></tbody> </table>
อธิบายการแก้ไขคำสั่งของพิมพ์สีที่ จขบกำกับ
กำหนดให้กรอบอยู่ในมุมที่ต้องการ เช่น left center right
ใส่สีให้เงาของกรอบ
ใส่สีให้พื้นหลัง


โดย: lozocat วันที่: 4 ตุลาคม 2553 เวลา:18:14:24 น.  

 
ลูกเล่นกรอบเขียนข้อความแบบต่างๆ ที่ จขบ.พอจะนึกออก .2

สร้างกรอบแบบง่ายๆ 4
<table border="0" cellspacing="0" cellpadding="5" width="100%" align="center" style="border-top: 3px double #F08080; border-bottom: 3px double #f08080"><tbody><tr><td align="center" valign="middle" style="background-color: #ffdab9">............เขียนข้อความ..........</td></tr></tbody></table> 
พิมพ์สีที่เห็นด้านบน สามารถเปลี่ยงแปลงได้ค่ะ
สร้างกรอบแบบง่ายๆ 5
<table border="0" cellspacing="0" cellpadding="4" width="100%" align="center" style="border: 5px double #cdb79e; background-color: #ffffff">  <tbody><tr><td align="center" valign="middle" style="border: 5px double #cdb79e; background-color: #ffffff">............เขียนข้อความ..........</td></tr></tbody> </table> 
พิมพ์สีที่เห็นด้านบน สามารถเปลี่ยงแปลงได้ค่ะ
สร้างกรอบแบบง่ายๆ 6
<table border="0" cellspacing="0" cellpadding="5" width="100%" align="center" style="border: 5px double #FF1493; background-color: #ffffff">  <tbody><tr><td align="center" valign="middle" style="border: 5px double #FFB6C1; background-color: #ffffff">............เขียนข้อความ..........</td></tr></tbody> </table> 
พิมพ์สีที่เห็นด้านบน สามารถเปลี่ยงแปลงได้ค่ะ
สร้างกรอบแบบง่ายๆ 7
<table border="0" cellspacing="5" cellpadding="2" width="100%" align="center" style="border: 5px solid #da70d6; background-color: #dda0dd">  <tbody><tr><td align="center" valign="middle" style="border: 5px solid #eed2ee; background-color: #ffffff">............เขียนข้อความ..........</td></tr></tbody> </table>  
พิมพ์สีที่เห็นด้านบน สามารถเปลี่ยงแปลงได้ค่ะ
สร้างกรอบแบบง่ายๆ 12
<table border="0" cellspacing="0" cellpadding="5" align="center" style="background-color: #ADFF2F; border: 2px ridge #ffffff"> <tbody><tr><td> <table border="0" cellspacing="0" cellpadding="5"><tbody><tr><td align="center" valign="middle" style="background-color: #FFFFFF; border: 2px ridge #ffffff">............เขียนข้อความ..........</td></tr></tbody></table> </td></tr></tbody></table>
อธิบายการแก้ไขคำสั่งของพิมพ์สีที่ จขบกำกับ
กำหนดให้กรอบอยู่ในมุมที่ต้องการเช่น left center right
ใส่สีให้เส้นของกรอบ
ใส่สีให้พื้นหลัง
สร้างกรอบแบบง่ายๆ 13
<table border="0" cellpadding="5" align="center"  style="border-top:2px dotted #FF69B4;border-left:2px dotted #1E90FF;border-bottom:2px dotted #9ACD32;border-right:2px dotted #FFD700;background-color:#FFFFFF;" cellpadding="5"><tr><td>............เขียนข้อความ..........</td></tr></table>
ดูตัวอย่างกรอบแล้วใส่สี ตามที่กำกับไว้
ชื่อชนิดของเส้นกรอบ
สีเส้นด้านบน เส้นสีด้านซ้าย สีเส้นด้านขวา สีเส้นด้านล่าง
กำหนดให้กรอบอยู่ในมุมที่ต้องการเช่น left center right
ใส่สีให้พื้นหลัง
สร้างกรอบแบบง่ายๆ 14
<table border="0" cellspacing="1" cellpadding="4" align="center" style="border: 1px solid #F5DEB3"><tbody><tr><td style="border-style: solid; border-width: 4px; border-color: #F5DEB3 #D2B48C #D2B48C #F5DEB3"bgcolor="#F5DEB3">............เขียนข้อความ..........</td></tr></tbody></table>
ดูตัวอย่างกรอบแล้วใส่สี ตามที่กำกับไว้
กำหนดให้กรอบอยู่ในมุมที่ต้องการเช่น left center right
ใส่สีให้เส้นรอบกรอบ
ใส่สีให้เงาของกรอบ
ใส่สีให้พื้นหลัง


โดย: lozocat วันที่: 5 ตุลาคม 2553 เวลา:2:57:41 น.  

 
ลูกเล่นกรอบเขียนข้อความแบบต่างๆ ที่ จขบ.พอจะนึกออก .1

สร้างกรอบแบบง่ายๆ 1
<table border="0" cellspacing="0" cellpadding="6" width="100%"align="center" style="border: 1px dashed #8098B8">  <tbody><tr><td align="center" valign="middle" style="background-color: #8098B8"> <table border="0" cellspacing="0" cellpadding="5" width="100%"  align="center" style="border: 1px dashed #EAECF4">  <tbody><tr><td align="center" valign="middle" style="background-color: #EAECF4">............เขียนข้อความ..........</td></tr></tbody> </table>  </td></tr></tbody> </table> 
พิมพ์สีที่เห็นด้านบน สามารถเปลี่ยงแปลงได้ค่ะ
สร้างกรอบแบบง่ายๆ 2
<table border="0" cellspacing="0" cellpadding="5" width="100%"align="center" style="border: 1px dashed #CDC0B0"> <tbody><tr><td align="center" valign="middle" style="background-color: #CDC0B0"><table border="0" cellspacing="0" cellpadding="4" width="100%" align="center" style="border: 1pt dashed #ffffff">  <tbody><tr><td align="center" valign="middle">............เขียนข้อความ..........</td></tr></tbody> </table>  </td></tr></tbody> </table> 
พิมพ์สีที่เห็นด้านบน สามารถเปลี่ยงแปลงได้ค่ะ
สร้างกรอบแบบง่ายๆ 3
<table border="0" cellspacing="0" cellpadding="5" width="100%" align="center" style="border: 1px dashed #9ACD32">  <tbody><tr><td align="center" valign="middle" style="background-color: #9ACD32"><table border="0" cellspacing="0" cellpadding="5" width="100%"  align="center" style="border: 1px dashed #CCFF99">  <tbody><tr><td align="center" valign="middle" style="background-color: #CCFF99"> <table border="0" cellspacing="0" cellpadding="4" width="100%"  align="center" style="border: 1px dashed #ffffff">  <tbody><tr><td align="center" valign="middle" style="background-color: #ffffff">............เขียนข้อความ..........</td></tr></tbody> </table> </td></tr></tbody> </table> </td></tr></tbody> </table> 
พิมพ์สีที่เห็นด้านบน สามารถเปลี่ยงแปลงได้ค่ะ


โดย: lozocat วันที่: 5 ตุลาคม 2553 เวลา:2:59:47 น.  

 
แบบใช้รูปเป็นพื้นหลัง
แบบที่ 1. แบบที่ใช้รูปเดียว
<table border="0" cellspacing="4" cellpadding="2" width="100%" align="center" style="background-image: url('..ใส่..//..ของรูปพื้นหลัง..')"><tbody><tr><td align="center" valign="middle">แบบที่ 1.</td></tr></tbody></table>
ตัวอย่าง
แบบที่ 1.
แบบที่ 1. แบบที่ใช้ 2 รูป
<table border="0" cellspacing="6" cellpadding="4" width="100%" align="center" style="background-image: url('...ใส่..//..ของรูปพื้นหลัง1..')"><tbody><tr><td align="center" valign="top" style="background-image: url('...ใส่..//..ของรูปพื้นหลัง2...')">แบบที่ 2. </td></tr></tbody></table>
ตัวอย่าง
แบบที่ 2.
แบบที่ 3. นำ Borders มาซ้อนเพื่อให้กรอบมีมิติมากขึ้น...
<table border="0" cellspacing="0" cellpadding="0" width="100%" align="center" style="border: 2px dashed #8b7d68"><tbody><tr><td align="center" valign="middle">แบบที่ 3. Borders</td></tr></tbody> </table>  
●ใส่ขนาด ใส่ชื่อของ Borders และใส่สี (dashed คือชื่อของเส้นรอยปะ)
ตัวอย่าง
แบบที่ 3.


โดย: lozocat วันที่: 7 ตุลาคม 2553 เวลา:3:09:51 น.  

 
วิธีนำโคดมาซ้อนกันแบบง่ายๆ ตัวอย่างที่ 1.....
แบบที่มี Borders อยู่ด้านนอก
ให้นำโคดในแบบที่ 1. หรือ แบบที่ 2  มาซ้อนด้านในโคด Borders
ตัวอย่าง.การนำโคด แบบที่ 1. มาซ้อนด้านใน โคด Borders
<table border="0" cellspacing="4" cellpadding="2" width="100%" align="center" style="background-image: url('//img543.imageshack.us/img543/3117/bkm108.gif')"><tbody><tr><td align="center" valign="middle">แบบที่ 1.</td></tr></tbody></table>
ซ้อนแบบนี้นะคะ** นำโคดด้านบนวางลงไปในโคดด้านล่าง
<table border="0" cellspacing="0" cellpadding="0" width="100%" align="center" style="border: 2px dashed #8b7d68"><tbody><tr><td align="center" valign="middle">วางโคดแบบที่ 1.ที่นี่</td></tr></tbody> </table> 
ก็จะได้....
ตัวอย่างที่ 1.....แบบที่มี Borders อยู่ด้านนอก
หากต้องการกำหนดความกว้างของกรอบ ให้แก้ที่ 100% ที่อยู่ ด้านนอกสุด ของกรอบนะคะ แก้เป็นตัวเลขเฉยๆ เช่น 320 - 450 หรือ ใส่เป้น 50% - 70% ก้ได้ค่ะ
หมายเหตุ** ถ้าใส่เป็นตัวเลขเฉยๆ ความกว้าง จะกว้างแค่ที่เรากำหนด แต่ถ้าใส่เป็น % ความกว้างจะยืดออกตามหน้าเวปของคุณค่ะ
วิธีนำโคดมาซ้อนกันแบบง่ายๆ ตัวอย่างที่ 2.....
แบบที่มี Borders อยู่ด้านใน
ให้นำโคดในแบบที่ 3. Borders   มาซ้อนด้านใน โคดแแบที่ 1. หรือ แบบที่ 2. ไม่ งง นะคะ 
ตัวอย่าง.การนำโคด แบบที่ 3. Borders มาซ้อนด้าน โคดแบบที่ 2
<table border="0" cellspacing="0" cellpadding="0" width="100%" align="center" style="border: 2px dashed #8b7d68"><tbody><tr><td align="center" valign="middle">แบบที่ 3.</td></tr></tbody> </table>
ซ้อนแบบนี้นะคะ** นำโคดด้านบนวางลงไปในโคดด้านล่าง
<table border="0" cellspacing="6" cellpadding="4" width="100%" align="center" style="background-image: url('//img687.imageshack.us/img687/7753/bkm110.gif')"><tbody><tr><td align="center" valign="top" style="background-image: url('//img543.imageshack.us/img543/3117/bkm108.gif')">วางโคดแบบที่ 3.ที่นี่ </td></tr></tbody></table>
ก็จะได้....
ตัวอย่างที่ 2.....แบบที่มี Borders อยู่ด้านใน
หากต้องการกำหนดความกว้างของกรอบ ให้แก้ที่ 100% ที่อยู่ ด้านนอกสุด ของกรอบนะคะ แก้เป็นตัวเลขเฉยๆ เช่น 320 - 450 หรือ ใส่เป้น 50% - 70% ก้ได้ค่ะ
หมายเหตุ** ถ้าใส่เป็นตัวเลขเฉยๆ ความกว้าง จะกว้างแค่ที่เรากำหนด แต่ถ้าใส่เป็น % ความกว้างจะยืดออกตามหน้าเวปของคุณค่ะ


โดย: lozocat วันที่: 7 ตุลาคม 2553 เวลา:3:28:49 น.  

 
เพิ่มโคดที่เกี่ยวกับพื้นหลัง**
สำหรับพื้นหลังเมื่อคลิกที่รูปพื้นหลัง พื้นหลังจะแสดงผลในหน้าเดียวกัน...
เพื่อนๆสามารถก็อปปี้โคดไปวางที่ กล่องทดสอบโคดตามลิงค์ด้านล่างเพื่อดูตัวอย่างการแสดงผลค่ะ
กล่องทดสอบโคด
<a href="javascript:document.body.style.backgroundImage='url(&quot;...ใส่..//..ของรูปพื้นหลัง...&quot;)';document.close();"> <img src="...ใส่..//..ของรูปพื้นหลัง..." border="0" width="120" height="120" /></a>
อธิบายโคด
●กำหนดขนาด ความกว้าง x ความยาว ของรูปภาพที่จะแสดงโชว์


โดย: lozocat วันที่: 7 ตุลาคม 2553 เวลา:3:29:41 น.  

 
สกอร์บ็อก
......ใส่ข้อความที่ต้องการ.....
<div style="width: 200px; height: 100px; background-color: #ffffef; overflow: auto; border-color:#c47a7a; border-style: dashed; border-width: 1px;">......ใส่ข้อความที่ต้องการ....</div>
อธิบายการแก้ไขคำสั่งของพิมพ์สีที่ จขบกำกับไว้นะคะ**
●ใส่ขนาดความกว้าง x ความสูง และใส่โคดสี ให้กับพื้นหลังของกล่องสกอร์บ็อก
●ใส่สี ใส่ชื่อชนิดของเส้นกรอบ ใส่ขนาดของเส้นกรอบ
แบบที่ 2. แบบที่ใช้รูป
แบบที่ใช้รูปและ กำหนดให้กล่องสกอร์บ้อกนั้นๆ แสดงผลตามคำสั้งที่เรากำหนด
<DIV style="OVERFLOW-Y: scroll; SCROLLBAR-FACE-COLOR: #8B0000; FILTER: chroma(color=#6B8E23); OVERFLOW-X: hidden; SCROLLBAR-HIGHLIGHT-COLOR: #ce9cbd; OVERFLOW: auto; WIDTH: 108px; SCROLLBAR-SHADOW-COLOR: #8B0000; COLOR: #8B0000; SCROLLBAR-3DLIGHT-COLOR: #8B0000; SCROLLBAR-ARROW-COLOR: #FFFFFF; SCROLLBAR-TRACK-COLOR: #FFFFFF; SCROLLBAR-DARKSHADOW-COLOR: #8B0000; SCROLLBAR-BASE-COLOR: #8B0000; HEIGHT: 116px">.....ใส่ข้อความที่ต้องการ.....</DIV>
อธิบายการแก้ไขคำสั่ง
●ใส่ขนาดความกว้าง x ความสูง
●แก้ไขคำสั่งตามสีที่กำกับไว้นะคะ
ตัวอย่าง**ที่จัดโคดแล้ว..ไว้จะสอนการจัดโคดแบบตัวอย่างด้านล่างนะคะ...อย่าลืมติดตาม
สุขสันต์วันเกิดมีความสุขมากๆนะจ๊ะ
สำหรับพื้นที่ ที่ ห้ามวางโคด
เนื่องจากทางบล็อคแก๊งได้กำหนดให้บางโคดไม่สามารถวางได้ในบางพื้นที่(อย่างโคดด้านบนเป็นต้น) เช่น ห้ามวางที่ช่องเขียนลายละเอียดบล็อก
เคล็ดลับเล็กๆ น้อยๆ...สำหรับที่ต้องการวางโคดในพื้นที่ ที่ห้ามวางโคดนะคะ**
เมื่อต้องการวางในพื้นที่ห้ามวาง..แค่ลบ โคดตัวปิดออกก้จะสามารถวางโคดในพื้นที่ห้ามวางได้โดยไม่มีผลเสียหายไดๆ
ตัวอย่าง**การลบโคดตัวปิดออก
<table border="0" cellspacing="0" cellpadding="0" width="170" align="center" style="height: 140px; background-image: url('//img689.imageshack.us/img689/5350/as12p.gif')">  <tbody><tr><td style="height: 5px"></td><td></td></tr><tr><td align="right" valign="top"><DIV style="OVERFLOW-Y: scroll; SCROLLBAR-FACE-COLOR: #8B0000; FILTER: chroma(color=#6B8E23); OVERFLOW-X: hidden; SCROLLBAR-HIGHLIGHT-COLOR: #ce9cbd; OVERFLOW: auto; WIDTH: 108px; SCROLLBAR-SHADOW-COLOR: #8B0000; COLOR: #8B0000; SCROLLBAR-3DLIGHT-COLOR: #8B0000; SCROLLBAR-ARROW-COLOR: #FFFFFF; SCROLLBAR-TRACK-COLOR: #C875A5; SCROLLBAR-DARKSHADOW-COLOR: #8B0000; SCROLLBAR-BASE-COLOR: #FFFFFF; HEIGHT: 116px"><font size="2" color="#8B0000" style="letter-spacing: 1px">สุขสันต์วันเกิดมีความสุขมากๆนะจ๊ะ<br><img src="//img134.imageshack.us/img134/5048/26894441.gif" width="10" border="0" height="514"></DIV></td><td style="width: 4px"></td></tr></tbody> </table>
แค่ลบตัวปิดซึ่งก็คือ ตัวนี้ </DIV> ให้ลบออกก่อนที่จะนำโคดไปวางในพื้นที่ห้ามค่ะ


โดย: lozocat วันที่: 7 ตุลาคม 2553 เวลา:6:52:33 น.  

 
textarea บ็อก
กล่องสำหรับโคดที่คุณไม่ต้องการให้ โคดนั้นๆแสดงผลโดยที่ไม่ต้องใช้ตัวแปล.....
textarea บ็อก
<textarea  onclick="this.focus();this.select()" style="overflow-x: hidden;font-family: tahoma; font-weight: bold; font-size: 10; COLOR: #C0C0C4 ; background: transparent; border:0;  HEIGHT: 125px; WIDTH: 320px; SCROLLBAR-FACE-COLOR: #ffffff; SCROLLBAR-SHADOW-COLOR: #ffffff; SCROLLBAR-HIGHLIGHT-COLOR: #ffffff; OVERFLOW-Y: scroll; FILTER: chroma(color=#ffffff); OVERFLOW-X: hidden;   SCROLLBAR-3DLIGHT-COLOR: #ffffff; SCROLLBAR-ARROW-COLOR: #3A8CBE; SCROLLBAR-TRACK-COLOR: #ffffff;   SCROLLBAR-DARKSHADOW-COLOR: #ffffff; SCROLLBAR-BASE-COLOR: #fffff; ">...วางโคดที่ต้องการที่นี่...</textarea>
อธิบายการแก้ไขคำสั่ง
●ใส่ขนาดตัวพิมพ์ และ สีของตัวพิมพ์
●ใส่ขนาดความกว้าง x ความสูง
●เปลี่ยนแปลงค่าตามสีที่กำกับไว้
ดูตัวอย่างจะเป็นแบบนี้นะ คะ**สมมุติ คุณอยากแสดงโคด ที่ยังเป็นโคด แค่คุณนำโตดทั้งหมดไปวางไว้ที่กล่องโคดข้างล่าง...โคดนั้นก็จะยังเป็นโคดอยู่โดยที่คุณไม่ต้องใช้ตัวแปล..ไม่ งง นะคะ
ถ้า งง ดูตัวอย่าง การวางนะคะ**สมมุติคุณต้องการที่จะแสดงโคดตามที่รุปตัวอย่างด้านล่าง
ซึ่งโคดที่ได้ก็คือ...
<table border="0" cellspacing="2" cellpadding="2" width="" align="center" style="background-image: url('//img148.imageshack.us/img148/1489/14775739.gif')"><tbody><tr><td align="center" valign="middle"><img src="//img706.imageshack.us/img706/1224/sf01137740102.gif" border="0" /></td></tr></tbody></table>
แค่คุณก็อปปี๊โคดของรูปไปวางในโคด textarea บ็อก..โคดนั้นก็จะแสดงเป็นโคดอยู่โดยที่คุณไม่ต้องใช้ตัวแปลไดๆช่วย  มันดีมากเลยใช่มั้ยคะ....และที่สำคัญแค่คุณคลิกลงที่บ็อกตัวโคดจะแสดงไฮไลน์เพื่อง่ายต่อการก็อปปี๊โคดอีกด้วยค่ะ
ตัวอย่าง**ดูตามสีนะคะ....
<textarea  onclick="this.focus();this.select()" style="overflow-x: hidden;font-family: tahoma; font-weight: bold; font-size: 10; COLOR: #C0C0C4; background: transparent; border:0;  HEIGHT: 125px; WIDTH: 318px; SCROLLBAR-FACE-COLOR: #ffffff; SCROLLBAR-SHADOW-COLOR: #; SCROLLBAR-HIGHLIGHT-COLOR: #; OVERFLOW-Y: scroll; FILTER: chroma(color=#ffffff); OVERFLOW-X: hidden;   SCROLLBAR-3DLIGHT-COLOR: #ffffff; SCROLLBAR-ARROW-COLOR: #3A8CBE; SCROLLBAR-TRACK-COLOR: #fffff;   SCROLLBAR-DARKSHADOW-COLOR: #ffffff; SCROLLBAR-BASE-COLOR: #ffffff; "><table border="0" cellspacing="2" cellpadding="2" width="" align="center" style="background-image: url('//img148.imageshack.us/img148/1489/14775739.gif')"><tbody><tr><td align="center" valign="middle"><img src="//img706.imageshack.us/img706/1224/sf01137740102.gif" border="0" /></td></tr></tbody></table></textarea>
ก็จะได้....
แบบที่แสดงผลทั้งหน้าเวป
แบบที่แสดงผลทั้งหน้าเวป
<style> body {
scrollbar-arrow-color:#FFFFFF ;
scrollbar-track-color: #FFF0F5;
scrollbar-face-color: #FF66CC;
scrollbar-highlight-color: #FFFFFF;
scrollbar-darkshadow-color: #FF3399;
scrollbar-3dlight-color: #FF3399;
scrollbar-shadow-color: #FF3399;
}</style>
อธิบายการแก้ไขคำสั่ง
●แก้ไขคำสั่งตามสีที่กำกับไว้นะคะ


โดย: lozocat วันที่: 7 ตุลาคม 2553 เวลา:6:54:40 น.  

 
กล่องเก็บเมนูลิงค์

<p align="center"><select onchange="if (this.options[this.selectedIndex].value != 'null') { window.open(this.options[this.selectedIndex].value,'new','toolbar=no,location=yes,directories=no,status=yes,menubar=yes,scrollbars=yes,resizable=ys ') }" style="width: 200; border: #c875a5 dashed 1px; padding: 1px; background:#fff0f5; color: #ff0000; "> <option><font size="2" style="letter-spacing: 1px">MENU</option> <option value='...ใส่..//..ของเวปลิงค์..'>เขียนชื่อเวปลิงค์</option><option value='...ใส่..//..ของเวปลิงค์..'>เขียนชื่อเวปลิงค์</option><option value='...ใส่..//..ของเวปลิงค์..'>เขียนชื่อเวปลิงค์</option><option value='...ใส่..//..ของเวปลิงค์..'>เขียนชื่อเวปลิงค์</option>นำโคดด้านล่างมาต่อกันตรงนี้**ถ้าไม่ต้องการต่อให้ลบข้อความตรงนี้ออก</select></p>
ตัวอย่าง**หากต้องทำลิงค์เยอะๆให้นำโคดลิงค์ด้านล่างมาต่อกันไปเรีอยๆ
<option value='...ใส่..//..ของเวปลิงค์..'>เขียนชื่อเวปลิงค์</option>
●ใสขนาดความกว้าง ใส่สี ใส่ชื่อของเส้น ใส่ขนาด ให้กับ เส้นรอบกล่อง (เส้นรอยปะ)
●ใส่โคดสีให้กับพื้นหลัง และ ใส่ โคดสีให้กับสีของตัวพิมพ์



โดย: lozocat วันที่: 7 ตุลาคม 2553 เวลา:6:56:24 น.  

lozocat
Location :


[ดู Profile ทั้งหมด]

ฝากข้อความหลังไมค์
Rss Feed
Smember
ผู้ติดตามบล็อก : 13 คน [?]

Friends' blogs
[Add lozocat's blog to your web]
Links
 

 Pantip.com | PantipMarket.com | Pantown.com | © 2004 BlogGang.com allrights reserved.