Како онемогућити догађај клика користећи ЦСС

Kako Onemoguciti Dogadaj Klika Koristeci Css



Дугмад се обично користе за обављање одређене радње. На пример, када кликнете на дугме за додавање, оно ће покренути одређени догађај. ЦСС нам омогућава да онемогућимо догађај клика. Дакле, ако желите да онемогућите догађај клика, додајте догађај показивача у ЦСС и подесите његову вредност у складу са захтевима.

У овом чланку ћемо научити како да онемогућимо догађај клика помоћу ЦСС-а.

Дакле, почнимо!







Како онемогућити догађај клика користећи ЦСС?

Можете да онемогућите кликове користећи ЦСС “ показивач-догађаји ' имовина. Али, ускачући у то, укратко ћемо вам то објаснити.



Шта је ЦСС својство „показивач-догађаји“?

показивач-догађаји ” контролишу како ХТМЛ елементи реагују или се понашају на догађај додира, као што су догађаји клика или додира, активни или лебдећи статуси и да ли је курсор видљив или не.



Синтакса
Синтакса показивача-догађаја је следећа:





показивач-догађаји : ауто | ниједан ;

Горе поменуто својство има две вредности, као што је „ ауто ' и ' ниједан ”:

  • ауто: Користи се за обављање подразумеваних догађаја.
  • ниједан: Користи се за онемогућавање догађаја.

Напомена: Пример у наставку ће прво показати како да додате два активна дугмета, а затим ћемо онемогућити догађај клика другог дугмета.



Пример 1: Онемогућавање догађаја клика дугмади помоћу ЦСС-а
У овом примеру, направићемо наслов <х1> и два дугмета. Затим наведите „ дугме ” као име класе првог дугмета и доделите „ дугме ' и ' дугме2 ” као класе другог дугмета.

ХТМЛ

< див >
< х1 > Онемогућите догађај клика користећи ЦСС < / х1 >
< дугме класа = 'дугме' > Омогући дугме < / дугме >
< дугме класа = 'дугме дугме2' > Дисабле Буттон < / дугме >
< / див >

У ЦСС-у, “ .дугме ” се користи за приступ оба дугмета креирана у ХТМЛ датотеци. Затим поставите стил ивице као „ ниједан ” и дајте допуну као „ 25пк ”. Након тога, подесите боју текста дугмета као „ ргб(29, 6, 31) ” и позадина дугмета као „ ргб(19, 192, 163) ”. Такође ћемо поставити радијус дугмета као „ 5пк ”.

ЦСС

.дугме {
граница : ниједан ;
паддинг : 25пк ;
боја : ргб ( 29 , 6 , 31 ) ;
боја позадине : ргб ( 19 , 192 , 163 ) ;
граница-радијус : 5пк ;
}

Након тога, применићемо :ацтиве псеудо-класу на оба дугмета као „ .буттон:активан ” и подесите боју дугмета као „ ргб(200, 255, 0) ”:

.дугме : активан {
боја позадине : ргб ( 209 , 65 , 65 ) ;
}

Као резултат, видећете следећи резултат:

Сада ћемо прећи на следећи део у коме ћемо онемогућити догађај клика за друго дугме.

Да бисте то урадили, користите „ .буттон2 ” да бисте приступили другом дугмету, креираном у ХТМЛ датотеци, а након тога, поставите вредност својства показивача догађаја као „ ниједан ”:

.буттон2 {
показивач-догађаји : ниједан ;
}

Коришћење својства показивача-догађаји и постављање његове вредности на нон ће онемогућити догађај клика, што се може видети у следећем излазу:

Обезбедили смо најлакши метод за онемогућавање догађаја клика помоћу ЦСС-а.

Закључак

Да бисте онемогућили догађај клика у ХТМЛ-у, „ показивач-догађаји ” се користи својство ЦСС-а. У ту сврху додајте ХТМЛ елемент и поставите вредност својства показивача догађаја као „ ниједан ” да бисте онемогућили догађај клика. Овај чланак је објаснио како да онемогућите догађај клика помоћу ЦСС-а заједно са његовим примером.