say

Capture css :D

posted on 08 Mar 2013 18:54 by limitblog in say directory Lifestyle
  ก่อนอื่นต้องขอขอบคุณท่าน @andwalk  หรือเจ้าของเดียวกับ @ozinepank ที่กรุณาให้ยืม idea
 ด้านล่างนี้มา แล้วถ่ายทอดออกมาในวิธีของผม -/\-

Icon interface of ThenewEditor by Exteen edit @ 3 Mar 2013 22:48:02 by ozinepank

    capture css  ของผมก็คือ การดูและวิเคาระด้วยตาเปล่า ว่า ส่วนนั้นๆน่าจะเป็นอย่างไรวางอะไรไว้ตรงไหน แล้วเอาความคิดนั้นมา "โฮ๊ะ" รวมกันออกมาเป็น css ครับ :D
 
    เรื่องมันมีอยู่ว่าผมได้ไปเอาเจ้าสิ่งนี้มาไว้ในครอบครอง >> csshat เมื่อไม่กี่วันที่ผ่านมา  เลยไปเสาะหา psd ที่เว็บ
ดีไซน์หมู มาลองหัดเล่นมีเยอะแยะมากมาย ทีนี้เล่นคนเดียวมันไม่สนุกเพราะอยากบล๊อกเอาไว้ใน exteen เลยไปเลือบเห็นบล๊อกใหม่ของท่าน @ozinepank (ที่เอาไว้รวมงานสร้างสรรค์)และไปเจอ  entry ข้างต้นก็เลยแอบทำตั้งแต่เวลา 20 นาฬิกา 8/3/56 จนออกมาได้เป็นรูปเป็นร่างในรูปแบบของ UI ทีนี้จะเอามาลงก็ยังไม่ได้ขออนุญาติเจ้าของ ก็แอบทำ video มาอีกอันฉบับมั่วซั่ว เพือรอการตอบรับการของเจ้าของ /*ผมดูเองยังขำเอง กะไม่เอามาลงด้วยซ้ำ*/

 
 สิ่งที่ผมใช้
สิ่งที่ได้ทำออกมา
 
 
อีกอันเป็นขั้นตอนการทำอย่างมั่ว 555+ ฮาเองทำเองครับด้านนล่าง
-------------------------------------------------------------------------
 
 
ท้ายนี้   -ในคลิปพูดผิดไปเยอะนะครับควรใช้ "วิจารณญาณ" ในการรับชม หรือไม่ก็กดข้ามไปเลย อิอิ
   
            -คาดว่าถ้าได้ทำอีกครั้งจะมั่วซั่วมากกว่านี้นะครับ :D
 
            -entry นี้ยกยอดให้ท่าน @andwalk ที่มีงานงามๆเอามาให้หัดทำนะครับ
Tags: css 6 Comments

css กันบูด

posted on 22 Feb 2013 21:58 by limitblog in say directory Lifestyle
หลังๆ ผมไม่เข้า @limitblog มาเขียนโม้อะไรเลย ส่วนเรื่อง css3 ก็น่าจะหาอ่านได้ไม่ยากตามเว็ปทั่วๆไป  entry นี้ว่าด้วยการ กันบูด กันลืม การใช้ css ของผมนั่นเองหลังๆไม่ได้เขียน demo อะไรเลยเห่อทำธีมด้วย jQuery อยู่ทาง @themeavanger นู้น และได้รับการช่วยเหลืออย่างล้นพ้นจากท่าน @pandora ในเรื่อง jQuery ท่าน @isadnop ในการช่วยเทส debug (เทสธีมเน่า) ต้องขอขอบคุณ ณ.ที่นี้ด้วยครับ :D
 
   ที่จริงผมชอบเขียนโปรแจค css3 demo เล็กๆ เล่นนะครับมันเพลินดี  แต่ด้วยแรงจูงใจไม่ค่อยมี จนผมได้เข้าไปเห็นใน timeline ของท่าน @ozinepank เค้าโพส blog ของท่าน @designil โอ๊ะๆ มาละๆ เข้าทางๆ ลองทำเป็นแบบ pure css ดู

สวัสดีครับ หลังจากห่างหายไปนาน ตอนนี้ไปฝึกวิชากลับมาอัพบลอคเหมือนเดิมแล้วคร้าบ ปกติผมมีเว็บส่วนตัวอยู่ที่ Designil.com ครับ และคอยอัพเดทข่าวสารต่าง ๆ เกี่ยวกับ Web Design ใน Designil Facebook Page ท่านใดสนใจลองแวะไปเยี่ยมชมกันนะคร้าบ วันนี้จะพูดถ...

21 Feb 2013 19:07
ก่อนอื่นต้องขออนุญาติ ท่าน @designil ณ.ที่นี้เลย ฮุฮุ ที่ถือวิสาสะเอางานของท่านมาโมใหม่ ในแบบ pure css ครับ :D
สามารถเข้าไปดู html css link: http://jsfiddle.net/emm_663/Er7Pz/1/   
 
    ไม่ได้ใส่ gradient background นะครับรีบไปหน่อย หลักการที่ผมใช้นั้นไม่ถึงกับยุ่งยาก

            <li class="tweet">
                <a href="#" class="tweet"><span>Follow on twitter</span><span>Twitter friend</span></a>
                <span>125</span>
            </li>
 
ตัวอย่างก้อนนี้ ผมจะแยกเป็นส่วนๆ เพื่อไม่ให้มีปัญหากับการใช้ css บังคับ
- li.div  // บังคับทั้งหมดตอน hover
- li a.div span // ใช้ show/hide  ตัวลงค์ hover
- li.div span  // ใช้โชว์เลข ต่อท้ายสุด
 
ส่วน css ไปดูเองละครับมันเยอะอธิบายไม่ถูก...
ไม่ต้องงนะครับถ้าใครเข้าไปดู css ตรง display:none กับ visibility:hidden ทำไมผมต้องใส่ไปทั้ง 2 อัน ผมพลาดเองครับ 555+
 
สิ่งที่พลาด
- ไม่ได้แยก ส่วนตัว logo ดันเอามาเป็น bg.
- gradient background
- z-index a.div span ขึ้นมาทับ bg
 ------------------------------------------------------------------
 
สุดท้าย ขอขอบคุณทุกๆที่ได้เอ่ยนามและสำคัญที่สุดคือท่าน @designil ที่ทำให้เกิด entry ขี้เกลียดของผมอันนี้ขึ้นมา ถ้าทำให้ท่านไม่สบายใจหรือประการใดยินดีลบกระทู้นี้นะครับ :D
 

สั้นๆ จบป่ะ

posted on 07 Jan 2013 18:17 by limitblog in say directory Lifestyle
สวัสดีปี 2556..  ครับผม โชคดี ที่ผมรอดตายมาจากเหตุการโลกแตกวันนี้เลยถือโอกาศเปลี่ยนธีม อีกล่ะ กด F5 ครับ.. วันนี้ สั้นๆ ตาม title เลยนะครับสือเนื่องเมื่อนหลายเดือนก่อนไปเจอ tutorial สั้นๆตามด้านล่าง

Search query Search @ Language: English Bahasa Indonesia Bahasa Melayu Dansk Deutsch Español Euskara Filipino Italiano Magyar Nederlands Norsk Polski Português Suomi Svenska Türkçe català français...

twitter.com
external link
ใจความว่า 
 
Want to make your image look like its on tv? Mosiac>4px - new layer>fill>pattern - pattern = 1x6px R(2px) G(2px) B(2px) - overlay.
 
โอ่ๆๆๆ นี่มันเป็นการสอน photoshop ที่สั้นและสวยงามมาก เลยทำออกมาอวดสัก ภาพ
 
อิอิ จบแล้วแหละ ..
 
 
ปล. Beta Tester Invitation ทาง exteen ใครอยากใช้ก็บอกเด้อเจ้าคะ
ขอบคุณภาพแมวจาก : http://stuffpoint.com/cats/image/51297/cute-cat-wallpaper1-wallpaper/