របៀបធ្វើ Toggle Button ជាមួយ CSS និងបិទបើកភ្លើងជាមួយ JavaScript

នៅ​ក្នុង​អត្ថបទនេះអាន-ANT សូមចុច Like គេហទំព័រ www.antkh.com ដើម្បី​ទទួលបានអត្ថបទថ្មីៗ​ប្រចាំ​ថ្ងៃ សូមលើកយកការ​ប្រើ​ប្រាស់ CSS ដើម្បី​ធ្វើជា​ Toggle switch button ស្រស់​ស្អាត ហើយជាមួយ​គ្នា​នេះ​ផងដែរ អាន-ANT ​ក៏​លើកយកពីរបៀប​បង្កើត​ការបិទ និងបើកភ្លើងជាមួយ JavaScript ដោយ​ប្រើ​ប្រាស់​ Button toggle ​ដែល​បាន design ​ជាមួយនឹង​ CSS នោះ​ផងដែរ ។

របៀបនៃការ​បង្កើត​

១. បង្កើត file ដោយដាក់​ឈ្មោះ​ថា toggleSwitch.html

២. សរសេរ​កូដ HTML ​ខាងក្រោម​បញ្ចូល​ក្នុង toggleSwitch.html

៣. សរសេរ​កូដ CSS ​ខាងក្រោម​បញ្ចូល​នៅ​ក្នុង toggleSwitch.html ហើយ​ក្នុង head tag

៤. បន្ទាប់មក​អ្នក Run file toggleSwitch.html ​ដែល​បាន​បង្កើត និងទទួលបាន​លទ្ធផល​ដូច​ខាងក្រោម​៖

៥. នៅ​ក្នុង​ file toggleSwithc.html ​សរសេរ​កូដ <img id="myImage" src="images/pic_off.gif"> នៅ​ខាងក្រោម h1 tag

6. នៅ​ក្នុង​ file toggleSwithc.html ដ​ដែល​សរសេរ​កូដ JavaScript ​ខាងក្រោម​បញ្ចូល ក្នុង head tag

​ចំណាំ​៖ រូបភាព​អំពូលត្រូវដាក់នៅ​ក្នុង folder ​ឈ្មោះ​ថា images ។

​លទ្ធផល​ក្រោយ​សរសេរ​កូដ​ទាំងអស់​ត្រឹមត្រូវហើយ

សូមសាកល្បងដោយខ្លួនអ្នក​ផ្ទាល់ ។

♦ រៀបរៀងអត្ថបទដោយ៖ លោក សំ រិទ្ឋី ត្រួត​ពិនិត្យ​និងកែ​សម្រួល​អត្ថបទដោយ៖ លោក ហេង ពេងលាប

♦ មុខវិជ្ផា web Design with CSS + Bootrap តម្លៃ ៨០ដុល្លា ឬ ៣២០០០០រៀល សម្រាប់ Course Outline នៃ​វគ្គ​នេះ http://training.antkh.com/website_design_with_css.aspx

♦ មុខវិជ្ផា JavaScript តម្លៃ ៧០ដុល្លា ឬ ២៨០០០០រៀល សម្រាប់ Course Outline នៃ​វគ្គ​នេះ http://training.antkh.com/

♦ ​សម្រាប់​ស្នាដៃសិស្ស​ដែល​បាន​បញ្ចប់​វគ្គ​គេហទំព័រជា​ច្រើន នៅអាន-ANT http://training.antkh.com/achievements/?c=web

♦ សូម​ចូលរួម​ជាសមាជិក ANT Training Group ដើម្បី​តាមដានសម្មភាពប្រចាំ​ថ្ងៃ​ជាមួយអាន-ANT
♦ ចុច Like គេហទំព័រ www.antkh.com ដើម្បី​ទទួលបានអត្ថបទថ្មីៗ​ដែល​ទាក់ទងនឹង​បច្ចេកវិទ្យា​រៀងរាល់​ថ្ងៃ​