Tech&Tips

1.ลูกเล่นเกี่ยวกับเมาส์

ทำให้ภาพเป็นขาวดำ  เมื่อเอาเม้าชี้ จะเป็นปกติ
a:link img {filter:xray();} a:visited img {filter:xray();} a:hover img {filter:none;}

รูปทุกรูปในจะกลืนไปกับ blackground เมื่อเอา mouseชี้รูปจะกลับเป็นปกติ

a:link img {filter:alpha(opacity=60);} a:visited img {filter:alpha(opacity=60);} a:hover img {filter:none;}

ชี้แล้วนูน
a:link img {filter:none;} a:visited img {filter:none;} a:hover img {filter:progid:dximagetransform.microsoft.emboss;}

Black and White with Color on Mouseover – รูปเป็นโทนขาวดำ เม้าท์ชี้เป็นสีเดิม

<style> a:link img {filter:gray;} a:visited img {filter:gray;} a:hover img {filter:none;} </style>

Flip Horizontally on Mouseover – รูปกลับด้านเวลาชี้

<style> a:hover img {filter:fliph;} </style>

Color with Black and White on Mouseover – เป็นโทนขาวดำเวลาเมาท์ชี้
<style> a:link img {filter:none;} a:visited img {filter:none;} a:hover img {filter:gray;} </style>

Flipped Horizontally with Normal on Mouseover - รูปกลับด้าน เม้าท์ชี้แล้วจะเป็นด้านปกติ

<style> a:link img {filter:fliph;} a:visited img {filter:fliph;} a:hover img {filter:none;} </style>

Blur on Mouseover – เบลอเวลาเม้าท์ชี้

<style> a:hover img {filter: blur(add = 0, direction = 225, strength = 10)}</style>

Blurred with Normal on Mouseover – เบลอ เวลาเม้าท์ชี้เป็นภสพปกติ

<style> a:link img {filter:blur(add = 0, direction = 225, strength = 10);}a:visited img {filter:blur(add = 0, direction = 225, strength = 10);}a:hover img {filter: none}</style>

Emboss on Mouseover – เม้าท์ชี้เป็นภาพแบบ EBboss (ภาพสลักแบบนูนขึ้มาสีเทา ๆ)

<style> a:link img {filter:none;} a:visited img {filter:none;} a:hover img {filter:progid:dximagetransform.microsoft.emboss;} </style>

<style> a:link img {filter:progid:dximagetransform.microsoft.emboss;} a:visited img {filter:none;} a:hover img {filter:none;} </style>

2.ทำ Facebook Fanpage Like Box ให้คนดูสามารถ "ถูกใจ" ได้

มีวิธีการดังนี้

  1. ไปที่ http://www.facebook.com แล้วเลือกที่ "สร้างหน้าใหม่" 

  2. สร้างหน้าใหม่ขึ้นมาก่อน พร้อมตั้งชื่อหน้า

  3. ยืนยันการ "สร้างหน้าใหม่" ด้วย

  4. Login ด้วย Account ของ Facebook (หรือถ้ายังไม่ได้สมัครสมาชิกก็สมัครสมาชิกก่อนเลย)

  5. ถ้าการสร้างสำเร็จ ระบบจะทำการสร้างหน้าขึ้นมาใหม่ให้เลย

  6. เสร็จแล้วให้ จด URL ของหน้า Page ที่สร้างขึ้นมาไว้ก่อน (โดยให้จดถึงแค่ตัวเลขก็พอนะครับ) ตามในกรอบดังภาพด้านล่าง

  7. นำมาใส่ใน Sourcecode  ด้านล่าง

      1.<!-- คุณสามารถตั้งค่าได้ใน Code ด้านล่าง 

       2.       

       3.  - ตรง http://www.facebook.com/pages/Thamwebsitecom/143034449075823 คือให้ใส่URL ของหน้า Page ที่ท่านได้จดไว้ในข้อ 6 ครับ 

       4.- แล้วก็สามารถตั้งค่าพวกความ กว้าง/สูง ได้ด้วย 

       5.- ตรง connections=12 นั้น ตรงค่า 12 หมายถึง จำนวนภาพของผู้ที่มากด LIKE เรา ที่จะให้แสดง 

       6. 

       7.  --> 

       8.       

      9.  <iframe src="http://www.facebook.com/plugins/likebox.php?href= 

     10. http://www.facebook.com/pages/Thamwebsitecom/143034449075823 

     11. & width=360&connections=12&stream=false&header=true&height=270" scrolling="no" frameborder="0" style="bodycolor:#DBE8F1;border:none; overflow:hidden; width:360px; height:270px;" allowtransparency="true"> 

     12.   </iframe> 

  8.   ก็เป็นอันเสร็จสิ้นแล้วครับ

3.ให้ GOOGLE.CO.TH เป็น SEARCH ENGINE ประจำ WEB คุณ

คำอธิบาย CODE

ตัวอักษรสีแดง คือ ให้เปลี่ยนเป็น URL ของ WEBSITE คุณ

ตัวอักษรสีน้ำเงิน คือ ให้แก้เป็นว่า ค้นหาใน .......

Source Code

ต้องการให้แสดง SEARCH ENGINE ที่ไหนก็นำ CODE ด้านล่างไปไว้

   1. <FORM method=GET action=http://www.google.co.th>

   2. <INPUT TYPE=text name=q size=14 maxlength=255 value="">

   3.  <INPUT type=submit name=sa VALUE="ค้นหา"><br>  new google.translate.TranslateElement({ 

   4. <input type=hidden name=domains value="codetukyang.com">

   5. <input type=radio name=sitesearch value="" checked> ค้นหาใน GOOGLE.CO.TH<br>

   6. <input type=radio name=sitesearch value="codetukyang.com"> ค้นหาในCodeTukyang.com

   7. </FORM>
   8.  ตัวอย่างของเว็บที่ให้ GOOGLE.CO.TH เป็น SEARCH ENGINE ประจำ WEB คุณ 

4.การซูมภาพเข้า-ออก

1. สร้างเอกสารขึ้นมาใหม่ ขนาด 310 x 310 โดยไปที่ Modify > Document หรือกดคีย์ลัด (Ctrl+J)

2. ตั้งชื่อ layer 1 เป็น zoom process และ import รูปมาไว้บน stage โดยไปที่ File > Import > Import to Stage หรือกด (Ctrl+R)

3. คลิกที่รูปภาพ กด F8 หรือคลิกขวาที่รูป เลือก convert to symbol เลือกเป็น movie clip ตั้งชื่อว่า picture

4. ตั้งชื่อ Instance Name ของ movie clip ที่ชื่อว่า picture ว่า zoom

5. ดับเบิ้ลคลิกที่ movie clip ชื่อว่า picture ที่สร้างขึ้นมา หลังจากนั้น ไปยังเฟรมที่ 10 กด F6 เพื่อ insert keyframe หลังจากนั้น กด F9 เพื่อใส่ action script ลงไป ดังนี้

stop();

6. กลับไปยังเฟรมที่ 1 แล้วใช้เครื่องมือ Free Transform Tool หรือกด (Q) และย่อรูปให้เล็กลง

7. คลิกขวาที่ frame 1 เลือก create motion tween

8. กลับไปที่ scene หลัก แล้วสร้าง layer ใหม่ ตั้งชื่อว่า button +

9. ใช้เครื่องมือ Text Tool หรือกด (T) พิมพ์คำว่า + zoom ลงไป หลังจากนั้นคลิกขวาที่ text เลือก convert to symbol เลือกเป็น button ตั้งชื่อว่า zoom ดังรูป

10. หลังจากนั้น คลิกขวาที่ ปุ่มที่สร้างขึ้นมา เลือก action script หรือ กด F9 ใส่ action script ลงไปดังนี้

on (release) {_root.mouse_over_zoom = true;

}

11. ใช้เครื่องมือ Text Tool หรือกด (T) พิมพ์คำว่า - zoom ลงไป หลังจากนั้นคลิกขวาที่ text เลือก convert to symbol เลือกเป็น button ตั้งชื่อว่า zoom out ดังรูป

12. หลังจากนั้น คลิกขวาที่ ปุ่มที่สร้างขึ้นมา เลือก action script หรือ กด F9 ใส่ action script ลงไปดังนี้

on (release) {_root.mouse_over_zoom = fstartlse;

}

13. สุดท้าย สร้าง layer ขึ้นมาใหม่ ตั้งชื่อว่า action คลิกที่เฟรมแรก กด F9 แล้วใส่ action script ลงไปดังนี้

_root.zoom.onEnterFrame = function() {if (mouse_over_zoom) {_root.zoom.nextFrame();} else {_root.zoom.prevFrame();}

};

14. ทดสอบ ด้วยการกด Ctrl+Enter

ลองทำกันดูนะครับเพื่อให้เว็บไซต์ของคุณมีความน่าสนใจมากขึ้นครับผม