About MeAll Entries

[Theme] Depthless

posted on 29 Apr 2012 09:42 by warrantica in ETC directory Idea
สวัสดีครับ 
 
สุขสันต์วันฮาโลวีน คริสต์มาส ปีใหม่ วาเลนไทน์ ตรุษจีน เอพริลฟูล และสงกรานต์ย้อนหลังครับ
 
(คือมันหายไปนานขนาดนั้น)
 
เอาละ อ่านมาถึงตรงนี้ก็จงเอานิ้วก้อยซ้ายไปคล้องเกี่ยวที่ปุ่ม Ctrl มุมล่างนั่น
แล้วเอื้อมนิ้วชี้พาดผ่านคีย์บอร์ดไปวางไว้บนปุ่ม F5
จากนั้นออกแรงในทางเข้าหาศูนย์กลางของโลกเบาๆ...
 
 
มันคือธีมใหม่ !!
 
 
 
 
 
 
ธีมใหม่นี้ชื่อ Depthless ครับ
 
ก็ตรงตัวแหละ คือธีมก่อนตรงหัวบล็อกมันเป็นสามมิติ แล้วมันดูรกๆ ยังไงไม่รู้
ธีมนี้เลยมาแบบเรียบๆ ไร้ความลึกใดๆ
 
ที่เปลี่ยนธีมก็เพราะ อย่างที่บอกไว้ในเอนทรี่ที่แล้วนั่นแหละ ว่าธีมเก่ามันพังไปทีละส่วน แถมพอเอ็กซ์ทีนเปลี่ยนแถบข้างบนใหม่บล็อกเลยเบี้ยวไปเลย 
 
ธีมควรจะหน้าตาแบบนี้:
 
 
(ถ้าไม่เห็นอย่างงี้กด ctrl+F5 ไปเรื่อยๆ นะ )
 
 
สิ่งที่เพิ่มมาใหม่
 
 
แน่นอน หัวบล็อก 
 
 
 
ดึงเมนูขึ้นมาไว้ข้างบนละ พอเอาเมาส์ไปจ่อมันจะเฟดรัวๆ
 
และที่ภูมิใจนำเสนอมากก็คือ...!!
 
 
 
กล่องคอมเม้นต์ !!
 
มัน...
 
มัน...
 
มันไม่ใช่เอ็กซ์ที๊นนนน
 
ตรงนี้ใช้ CSS3 เยอะมาก แก้มันทุกสิ่งอัน 
 
 
ต่อมาก็ส่วนที่แสดงคอมเม้นต์
 
จริงๆ ก็ปกติแหละ ที่แปลกไปคือผมจะซ่อนดาวแดงในคอมเม้นต์
 
แล้วทำเป็นแบบนี้แทน
 
 
จริงๆ คอมเม้นต์นั้นมีดาวอยู่ตรงช่องว่างๆ นั่นสองดวง
 
สรุปคือถ้าในคอมเม้นต์มีดาว ดาวนั้นจะถูกซ่อนไว้และคอมเม้นต์ทั้งคอมเม้นต์จะออกสีแดงหน่อยๆ แล้วมีดาวตรงมุม
 
เหมือนมาร์คไว้ว่า เม้นต์นี้กดดาวไปแล้วนะ
 
สาเหตุหลักๆ ก็เพราะเวลาให้ดาว ดาวกี่ดวงก็มีค่าเท่ากัน
 
แล้วมันก็ดูสวยดี 
 
ตอนนี้กำลังคิดเรื่องปุ่มไลค์อะไรประมาณนี้อยู่
คือแสดงให้เห็นว่าชอบเอนทรี่นี้ แต่มันไม่เหมาะที่จะเอาขึ้นหน้าแรก
 
เสร็จแล้วเดี๋ยวใส่ในบล็อกนี้แหละ
 
(คงทำแจกด้วย ถ้ามีคนเอาน่ะนะ )
 
 
สิ่งที่เอาออกไป
 
 
เยอะมาก... แทบไม่เหลืออะไรเลย
 
ไซด์บงไซด์บาร์หายเกลี้ยง เพราะข้อมูลทุกอย่างอยู่ในเมนูหมดแล้ว
 
footer ธีมเก่าที่แสนภูมิใจก็โดนโละออกไป 
 
อีกอย่าง (ที่ไม่เชิงเอาออกซะทีเดียว) คือ CSS เขียนขึ้นจากไฟล์เปล่า
 
ปกติธีมที่ใช้ทั้งหมดจะแก้จากธีม Apollo ของเอ็กซ์ทีนเอง
มาคราวนี้ธีมเยอะเกิน ไม่รู้จะโมจากอะไร
เขียนใหม่ซะเลย 555
 
 
 
 
 
ตรงนี้จะพูดเรื่องเทคนิก CSS นิดนึง
 
อย่างแรกเลย ผมใส่ CSS transition ให้ลิ้งค์ทุกตัวในบล็อก จะเห็นว่าเวลาเอาเมาส์ไปจ่อแล้วมันจะเฟดสีนิดนึง
 
แต่คราวนี้ผมใส่ transition:all เข้าไป ลิ้งค์ตรงแถบดำข้างบน (ซึ่งแก้ background position เอาเวลา hover) มันเลยเลื่อนวื้บๆ ไปด้วย ตอนแรกคิดว่าจะเอาออกแต่ดูไปดูมาก็สวยดี 
 
ตรงคอมเม้นต์ใช้ nth-child กับ nth-of-type เยอะมาก เพิ่งเห็นประโยชน์มันก็คราวนี้แหละ
 
ที่วงเล็บชื่อนั่นตอนแรกจะใช้ javascript แต่นึกขึ้นได้ว่า CSS3 มี :before กับ :after
 
เลยจับใส่ซะ
 
ใครสนใจก็ส่องได้ตามสบาย
 
 
 
 
 
เอนทรี่นี้คงมีแค่เรื่องนี้แหละ เดี๋ยวอีกไม่กี่วันจะมาอัพเดตเรื่องจิปาถะอีกที
 
เจอกันเอนทรี่หน้าครับ 
 
 
ปล. สกิลการเขียนให้อ่านรู้เรื่องมันหายไปไหนหมด...
 
ปล 2. ใครเจอบั๊กอะไรรบกวนแจ้งด้วยนะครับ จะเป็นพระคุณอย่างสูง 
 
ปล 3. อาจจะเอา emoTion มาใส่บล็อกนี้อีกที
 
 

Comment

Comment:

Tweet

แอบส่องแล้วได้ความรู้มากเลยค่ะ
ขอลองนำไปโมฯใช้นะคะHot!
question Hot! โหลดตงไหนอ่ะ
อลังการงานสร้าง ส.ว. มึน sad smile

#32 By ปิยะ99 on 2012-05-03 16:51

พระเจ้า มันเมพมากกก
(เข้ามา ใช่เอ็กทีนป้ะว่ะ -O- 555)Hot! Hot! Hot!

#31 By #PM on 2012-05-03 16:01

โอ้ สุดยอด ดาวเจิดได้อีกจริงๆ >w<
ว่าแล้วก็เราก็จิ้มจึ๊ก =w=//จิ้มๆๆๆHot! Hot! Hot! Hot! Hot! Hot! Hot!

#30 By Sphere Root on 2012-05-02 21:19

สุขสันต์วันฮาโลวีน คริสต์มาส ปีใหม่ วาเลนไทน์ ตรุษจีน เอพริลฟูล และสงกรานต์ย้อนหลัง(สำหรับพี่วาร์) เช่นกันค่าาา
คิดถึงสุโค่ยยยยย
เปิดตัวธีมใหม่อลังการงานสร้างสมกับเป็นสุดยอดธีมเมคเกอร์ในดวงใจเลย แอร๊ยยยยย~~

ใจจริงก็อยากจะส่อง แต่ว่าช่วงนี้ขี้เกียจ ยังไม่มีไอเดียทำธีมใหม่ เลยไม่รู้จะส่องไปทำไม = ='

ยังคิดถึงแชทบ๊อกซ์มุมขวาล่างอยู่นะ ^^
แล้วเท่าที่จำได้คือภาพวิวสวยๆตรง Header กับ Footer
//นึกๆดู ไม่ได้เข้าบล็อกพี่วาร์นานมากๆ - -.....

ความคิดเห็นกับธีมนี้ :
- อย่างแรกเลยคือชอบไอเดียดาวแดงในเมนต์แล้วขึ้นเป็นกล่องคอมเมนต์สีแดงกับรูปดาวแดงบนหัวมุม
ถ้าคะแนนเต็ม 10 ให้ 20 เลยเอ๊า!!!
เป็นอะไรที่

"แจ่ม แจ แด แจ่ม ว๊าวววววววววว
ณ บัดนาววว
นั้นโดนนนนน ใจจจจจจจ"~~

นอกจากทำให้ดูไม่แสบตาจากการโดนสีอันแสบสันของดาวแดงกระแทกลูกตา
ยังทำให้คอมเมนต์ในบล็อกดูมีสีสัน สลับขาว-แดงอมชมพู(?)
กล่องคอมเมนต์ที่ดูเรียบๆ ซอฟต์ๆ ทำให้บล็อกออกมาดูอ่อนโยนและน่าทะนุถนอม ^w^

- ธีมใหม่ให้ความรู้สึกเหมือนธีม Skylark ของ Exteen เลย
น่าจะเพราะสีออกเทาๆ แล้วก็ดูเรียบๆ
เวลาคนเข้าบล็อกมาจะได้ไม่ยุ่งยาก เผลอไปกดนู่น นี่ นั่น ไปไหนต่อไหนก็ไม่รู้ - -***
จัดหมวดหมู่รวมไว้ที่เดียวเลย ^^

- ลูกเล่นเวลาเราเอาเม้าส์ไปชี้อิโมฯในกล่องเมนต์ หรือ B I U Link ที่มันจะขึ้นเป็นกรอบสีเทา หรือกล่องสีฟ้า แล้วพอเราเอาเม้าส์ออก มันจะค่อยๆจาง
ความรู้สึกเหมือนเป็นไอๆ ที่ค่อยๆโผล่ออกมา แล้วค่อยๆจางหายไป
(ถึงแม้มันจะเป็นอะไรเล็กๆก็เถอะ *w*)
*เพิ่งสังเกตว่าตรง Header ก็เป็น >.<

ให้คะแนนกับธีมนี้ 10000%!!!
ประทับใจกับธีมของพี่วาร์อยู่เหมือนเดิมมมม ไม่เคยเปลี่ยน~~~

คอมเมนต์ซะยาว ให้หายคิดถึงไปเลยทีเดียวเชียวล่ะ!!
หลังจากแพรี่เปิดเทอมอาจได้คุยกันบ่อยขึ้น
เพราะแพรี่สอบได้วิศวกรรมซอฟต์แวร์
น่าจะได้เรียนภาษาทางด้านคอมพิวเตอร์เยอะขึ้น
ไม่รู้จะเรียน CSS HTML อะไรแบบนั้นด้วยรึเปล่า...
แต่ก็ขอฝากตัว(อีกรอบ) เป็นศิษย์ด้วยนะคะ ;)

ก่อนจะจากกัน
Hot! << ดาวอยู่ตรงนี้ ^w^~

#29 By !@Leaderdevil-demon@! on 2012-05-01 11:42

ชอบตรงดาวมากเลยค่ะ ธีมสุดยอดมาก ! //กดดาว Hot! Hot!

#28 By Konaku u u ~♪ on 2012-05-01 08:53

ธีมสวยมากครับ big smile

#27 By Siegburner on 2012-05-01 01:39

เสนอใส่เข้าไปใน Exteen ถาวรเหมือน Theme อื่นเลย !! Hot!

#26 By [zzlovers] on 2012-04-30 21:30

สุดยอดเลยค่ะO{}O)b!!Hot!

#25 By Kufufu on 2012-04-30 20:28

โอ๊ยยยย ชอบจังเลยค่ะ ธีมเรียบๆแบบนี้

><

#24 By ~ คุณใบเตย ~ on 2012-04-30 19:09

เจ๋งสุโค่ยยยย *ปรบมือ แป่ะๆ* double wink
ชอบๆ Hot!

#23 By I3NP on 2012-04-30 16:47

ขอบคุณมากค่ะ ชอบมากเลย cry Hot! Hot! Hot!

#22 By AERN on 2012-04-30 16:37

ว้าวววว สุดยอดค่าา Hot! Hot! Hot!

#21 By Alancia on 2012-04-30 13:13

สวย โล่ง สบายตา
แถมครีเอทอีก ชอบ ๆcry
กล่องคอมเมนต์ดาวนี่สุดยอดมากค่ะHot!

#20 By ICEgotcha! on 2012-04-30 13:01

ว้ายย
สวยมากค่ะ ; v ; Hot! Hot!

#19 By ★ Lera on 2012-04-30 12:29

แหล่มคับHot! open-mounthed smile big smile

#18 By i-tose on 2012-04-30 12:23

เอ้าไม่ติด! Hot! Hot!

#17 By iSadNop on 2012-04-30 11:52

ทีมงานโยนดาว

#16 By iSadNop on 2012-04-30 11:52

ธีมบล็อคสวยมากเลยค่ะ ชอบตรงดาวที่สุดแล้ว // ปาดาวใส่ซะเลย Hot! Hot! Hot! Hot! Hot! Hot! Hot! Hot!

#15 By Timmiiz on 2012-04-30 11:49

โล่งดีจัง

คอมเมนท์เจ๋งมากค่ะHot! big smile

ว่าก็ทดสอบซะหน่อยdouble wink

#14 By jin on 2012-04-30 09:41

ธีมเธอเริ่มห่างไกลจากความเป็นบล็อกปรกติขึ้นทุกที.... ทุกที...
ครีเอทีฟมาก.....
กลัวพวกเก่ง CSS ทำได้ไง.....

ทดลอง ๆ Hot!

#13 By หมอก on 2012-04-30 04:53

เเหล่มเป็ดมากๆเลยครับ

#12 By CGshelf on 2012-04-30 00:21

Hot! Hot! Hot!

เจ๋งจริงครับconfused smile
Hot! Hot!
เมพนักกก //คอมเม้นท์เพราะอยากลองกล่องคอมเม้นท์ #ผิด
เหยดดด กลับมาอย่างเจ๋ง ก๊ากกก
แต่ทางนี้เข้าใจไม่ถึงครึ่งที่ท่านเขียนในเอนทรี่ CSS มัน...มันช่างลึกซึ้ง o<-<

#9 By saisuna on 2012-04-29 23:26

สะอาดมาก มินิมอลสุดๆ Hot!

#8 By inatmon on 2012-04-29 22:30

โลกดีนะครับ :) ชอบโล่งๆ

อยากได้จุง คอมเม้นแบบนี้ Hot!

#7 By Howl on 2012-04-29 21:16

ดูแล้วสบายตาดีแฮะ
เรียบง่ายอีกด้วย

#6 By K ToKa on 2012-04-29 21:08

งามมากกกกก ดูสะอาดไร้มลทิน(?)ดีฮะ 5555
ว่าแล้วลองปาดาว *3* Hot! ♥♥

#5 By さくちゃん on 2012-04-29 20:40

สวยค่ะ !!Hot!

#4 By ต้นปาล์ม on 2012-04-29 20:26

ธีมสุดยอดมากค่ะ

โดยเฉพาะดาว มันแหล่มมาก =w=b Hot!

#3 By luluke on 2012-04-29 20:14

ธีมสุดยอดดดดดดดดดดดดดดดดดดดดดดดดดดดดด

#2 By ผีน้อย on 2012-04-29 20:10

สุโค่ยง๊าฟฟ ;w;b # ทำออกมาแจกสิ รับรองเป็นพันเป็นหมื่นโหลด =w=b Hot!

#1 By Ryoma D on 2012-04-29 20:08