กล่องคอมเม้นท์แบบเรียบ CmBox-Ed.4 (250px)

( 5754 views )

รูปตัวอย่าง

Description

โค้ดกล่องคอมเม้นท์ชุดนี้ ออกแบบมาสำหรับท่านที่ชอบความเรียบง่าย ดูเป็นระเบียบ บล๊อกคอมเม้นท์ชุดนี้จะมีขนาดกว้างเพียง 250px และสูงตามจำนวนคอมเม้นท์ โดยโค้ดชุดนี้สามารถแสดงผลรองรับได้ทุกบราวเซอร์ และแสดงผลเหมือนกัน

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

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

Support: IE6-7-8, FireFox2-3, Chrome, Safari, Opera

Code

<style>

.commentEditorNew input {
font-size:0px;letter-spacing:100px;
text-indent:-999px;border:none;
width:77px;height:26px;
cursor:pointer;overflow:hidden;
background:url(http://img263.imageshack.us/img263/8369/buttonxdn.png) bottom center no-repeat}

#comments {width:250px;
border:1px solid #D6D6D6;
color:#616161;
font-size:10px;
padding:8px;
}

#comments .content {width:250px}

#comments .subsection {width:240px;
padding-left:0px !important}

div.commentEditorNew form div {text-align:right !important}

div.commentEditorNew form textarea.textbox {width:248px;
border:1px solid #D6D6D6;}

.comment {width:240px}

.comment-text {width:185px !important;
margin-top:0px !important;
font-size:10px}

.comment-picture {height:40px !important;width:40px;border:none}
.comment-picture a img {width:40px; height:40px;}

.comment div {display:none}
.comment-picture,.comment-text {
display:block !important
}

#comments .listitem-separator {
background:none !important;
border-top:solid 1px #eeeeee;
width:250px;margin:2px auto !important
}

#comments h3 {border:none}
#comments h3 a {font-size:12px;color:black}

#comments h1,#comments h2,
h2.editorTop {display:none}
#commentImage {display:none}
.comment-text img {display:none}
.comment-text object {display:none}
.comment-text br {display:none}
.comment-text div {display:none}
.comment-text font {color:black!important}
.comment-text a img {display:none}
.comment-text embed {display:none}
.comment-text b,.comment-text u,
.comment-text s,.comment-text i,
.comment-text a
{display:none}

</style>

** ถ้าต้องการให้บล๊อกชิดฝั่งขวา เพิ่มโค้ดนี้เข้าไปนะครับ

#comments { margin:0 0px 0 auto }

*** ถ้าต้องการให้บล๊อกอยู่กึ่งกลาง ให้เพิ่มโค้ดนี้เข้าไป

#comments { margin:0 auto }

Last update: 19 August 2009

13 Comment(s)

13.

brown say:

November 7, 2009 - 11:01:38

ขอบคุณคร้า

12.

nut say:

November 5, 2009 - 20:14:52

http://donut-nz.hi5.com

พี่ต้า รบกวนหน่อยค่ะ คือ นัทอยากได้โค๊ด ที่เวลาเราไปเม้นให้ใครแล้วรูปเรามันใหญ่ กว้างแบบสี่เหลี่ยม ผืนผ้าอะค่ะ

11.

Boat say:

October 27, 2009 - 18:40:18

ขอบคุณมากๆเลยคับ

10.

tong say:

October 14, 2009 - 16:35:34

oเล็กๆ น่ารัดี ขอบคุน มาก ค่ะ

taku say:

October 12, 2009 - 21:33:45

http://tapopo.net

@PiimZz ==> #comments .comment .comment-picture + div { display: none } ใช้ไม่ได้กับ IE6 นะครับ

PiimZz say:

October 12, 2009 - 13:14:21

http://pim22184.hi5.com

อ่า ขอโค้ดที่ลบ แต่ ที่ดูคอมเม้น ของเรากับเพื่อน นะคะ ^^

earn say:

October 4, 2009 - 23:05:29

ไม่เห็นขึ้นอะไรเลยครับ

sine say:

October 4, 2009 - 14:38:46

http://sinezoq-ta.hi5.com

ขอบคุนนะคะพี่ต้า^^

boy say:

September 24, 2009 - 13:07:09

ขอบคุณมากครับ

ไม่มี say:

September 16, 2009 - 21:13:41

ขอบคุณมากค่ะ ตามหาเว็บพี่ต้าตั้งนาน ในที่สุดก็เจอ

sammy say:

September 2, 2009 - 12:48:29

thank a lot naka

นัท say:

August 30, 2009 - 21:35:19

ขอบคุงนะค่ะ

bringza say:

August 28, 2009 - 16:50:02

http://beenarak.hi5.com

ขอบคุณมากนะคร้า..อิอิ

Comment

Main

Last crawler

5 bot recent visit

GoogleBot9 February 2010, 8:43 am

GoogleBot9 February 2010, 5:29 am

GoogleBot9 February 2010, 4:19 am

GoogleBot8 February 2010, 11:53 pm

GoogleBot8 February 2010, 9:52 pm