Get Adobe Flash player

Monthly Archives: January 2018

CSS : การใช้ cursor

ปกติแล้วเวลาใช้งานเว็บไซต์ต่างๆ CURSOR หรือเมาส์ที่ชี้มักจะแสดงในรูปลูกศร หรือเป็นรูปมือเวลาเลื่อนเมาส์ไปชี้ที่ LINK ต่างๆ แต่ถ้าต้องการตกแต่งเว็บไซต์ให้มีความน่าสนใจยิ่งขึ้น การเปลี่ยนรูป CURSOR ก็เป็นอีกเทคนิคหนึ่งที่สามารถทำได้ง่ายๆ

การเปลี่ยนรูป CURSOR สามารถเขียนด้วย CSS ด้วยคำสั่งนี้

cursor: รูปแบบที่ต้องการให้แสดง;

 

ตัวอย่างการใช้

<a href=”https://www.yourlink_url.com” style=”cursor:crosshair“>ลากเมาส์มาตรงนี้</a>

 

ผลลัพธ์

ลากเมาส์มาตรงนี้
 

เมื่อเลื่อนเมาส์ไปชี้ จะสังเกตได้ว่า CURSOR จะแสดงผลต่างไปจากปกติ ซึ่งเป็นไปตามรูปแบบที่เรากำหนด
ซึ่งรูปแบบของ CURSOR ภายใต้คำสั่ง CSS ที่สามารถเปลี่ยนรูปแบบได้หลายรูปแบบ อย่างเช่นรูปนี้

Credit :

  • http://coursesweb.net/css/css-cursor-property-custom-cursors
  • https://www.webcodegeeks.com/css/css-cursor-pointer-example/
  • http://www.codetukyang.com/html/technic/mouseover_chg_cursor.htm

การใช้ jQuery Validation

Download File จากลิ้งค์นี้

https://github.com/jquery-validation

 

 

จากนั้นนำไปวางไว้ในโฟลเดอร์

 

เรียกใช้

โดยใส่ไว้ในส่วนของ<head> ของไฟล์ HTML

 

ตั้งชื่อ id ให้ฟรอมที่ต้องการจะตรวจสอบ

 

 

ตั้งชื่อให้ input ที่ต้องการจะให้ตรวจสอบ

 

จากนั้นสร้างไฟล์  validate.js

 

 

rules : จะเป็นส่วนในเงื่อนไขของการตรวจสอบ

messages : จะเป็นการกำหนดข้อความในการแสดง error message

 

Validate confirm password (Angularjs directive)

โดยปกติแล้ว Angularjs จะ build-in validation มาให้สำเร็จแล้ว แต่หากต้องการ validate confirm password เวลาสมัครสมาชิกหรือลงทะเบียนว่าตรงกับ password ที่ตั้งตอนแรกหรือไม่ สามารถใช้ directive ช่วยเพื่อให้การตรวจสอบ form ทำได้ครบสมบูรณ์

เริ่มต้นด้วยการสร้าง directive

Html (Bootstrap 3.x) ใช้ directive ในรูปแบบ attribute แทรกไว้ใน input confirm password

ผลลัพธ์

ทำให้ Gridview Devexpress (MVC) แก้ไขได้

1 ไปที่ Global.asax

2. จะเจอ Application_Start() ให้ทำการใส่โค้ดนี้ลงไป

3. จะได้ดังในภาพ

4. ให้ทำการ Build โดยกด Ctrl+Shift+B  จะทำการ Build Project  แค่เท่านี้ก็จะสามารถแก้ไขจากตารางได้