|
 |
|
อยากจะทำเว็บที่หน้าตาคล้ายแบบนี้ครับ มี Template หรืออะไรแนะนำไหมครับ ที่จะพอใกล้เคียง ตามรูป |
|
 |
|
|
 |
 |
|
ตัวนี้ครับ http://gridbyexample.com/examples/
|
 |
 |
 |
 |
Date :
2017-03-20 14:22:59 |
By :
mr.win |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
แอดครับ แล้วเครื่องหมายติ๊กถูกผิด ในรูปเขาใช้อะไรหรอครับ พอดีผมรู้จักแค่ radio กับ checkbox ถ้าผมอยากให้ติ๊กถูกผิดแบบเขาได้บ้าง ต้องใช้ js อะไรหรอครับ พอจะแนะนำได้ไหมครับ ขอบพระคุณครับ
|
 |
 |
 |
 |
Date :
2017-03-20 15:20:09 |
By :
damnern007 |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
ถ้าต้องการจะทำแบบนั้น (แบบตัวอย่าง) สามารถทำได้หลายแบบครับ อาจจะใช้ Javascript จัดการกับ Event OnClick แล้วส่งค่า หรือ Parameter ไปดำเนินการอะไรก็ว่ากันไป หรือจะใช้ CSS Hover อันนี้ก็แล้วแต่ว่าต้องการผลลัพธ์แบบไหน แต่ถ้าหากต้องการจะส่งค่าจากฟอร์มไปดำเนินการอะไรสักอย่าง ก็คงไม่พ้น Javascript ครับ แต่จริงๆแล้ว ท่านสามารถจะ View Source ดูจากตัวอย่างได้นะครับ แล้วดูว่าเขาใช้เทคนิคอะไร  
|
 |
 |
 |
 |
Date :
2017-03-22 03:39:54 |
By :
Manussawin |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
ขอบพระคุณทุกท่านมากครับ พอดีรูปนี้ถ่ายมาจากในคู่มือครับเลยส่องอะไรไม่ได้เลย
|
 |
 |
 |
 |
Date :
2017-03-22 09:28:06 |
By :
damnern007 |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
Code (PHP)
<div align="center" style="position:relative;">
<img src="x.jpg" style="position:absolute;top:-15px;left:auto;right:-15px;"><!-- รูปกากบาท -->
<img src="img.jpg" width="120" height="120"><!-- รูปโปรไฟล์ -->
<div style="position:absolute;bottom:0;left:0;width:100%;background:rgba(0,0,0,0.5);color:#fff;padding:1em 0">Test</div><!-- ข้อความ -->
</div>
|
 |
 |
 |
 |
Date :
2017-03-22 09:52:43 |
By :
num |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
สรุป...ศึกษาเรื่อง css เพิ่ม ถ้าเข้าใจถึงการทำงาน css ตาม คห.ที่ 6 ก็จะสามารถจัดการวางสิ่งที่ต้องการได้หมด
ส่วนการเปลี่ยนสถานะรูป เครื่องหมาย ถูก ผิด หรือการกระทำต่างๆ การคลิ๊ก - > ใช้ jquery ในการควบคุม
จับ id จับคลาส จับ Element ส่วนประกอบให้ถูก ช่วยแบ่งเบาได้ดีครับ
|
 |
 |
 |
 |
Date :
2017-03-22 10:41:28 |
By :
apisitp |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
|
|
|

|
Load balance : Server 02
|