اس آرٹیکل میں، ہم سی ایس ایس کا استعمال کرتے ہوئے کلک ایونٹ کو غیر فعال کرنے کا طریقہ سیکھیں گے۔

تو، چلو شروع کریں!

CSS کا استعمال کرتے ہوئے کلک ایونٹ کو کیسے غیر فعال کیا جائے؟

آپ CSS کا استعمال کرتے ہوئے کلک ایونٹس کو غیر فعال کر سکتے ہیں۔ پوائنٹر واقعات ' جائیداد. لیکن، اس میں کودتے ہوئے، ہم آپ کو مختصراً اس کی وضاحت کریں گے۔

'پوائنٹر ایونٹس' سی ایس ایس پراپرٹی کیا ہے؟

' پوائنٹر واقعات ” کنٹرول کریں کہ HTML عناصر کس طرح ٹچ ایونٹ کا جواب دیتے ہیں یا برتاؤ کرتے ہیں، جیسے کہ کلک یا ٹیپ ایونٹس، فعال یا ہوور اسٹیٹس، اور آیا کرسر دکھائی دے رہا ہے یا نہیں۔

نحو
پوائنٹر ایونٹس کا نحو درج ذیل ہے:

مذکورہ پراپرٹی دو قدریں لیتی ہے، جیسے ' آٹو 'اور' کوئی نہیں ”:

• آٹو: یہ پہلے سے طے شدہ واقعات کو انجام دینے کے لیے استعمال ہوتا ہے۔
• کوئی نہیں: یہ واقعات کو غیر فعال کرنے کے لیے استعمال کیا جاتا ہے۔

نوٹ: ذیل میں دی گئی مثال سب سے پہلے یہ ظاہر کرے گی کہ دو فعال بٹن کیسے شامل کیے جائیں، اور پھر ہم دوسرے بٹن کے کلک ایونٹ کو غیر فعال کر دیں گے۔

مثال 1: CSS کا استعمال کرتے ہوئے بٹنوں کے کلک ایونٹ کو غیر فعال کرنا
اس مثال میں، ہم ایک سرخی

اور دو بٹن بنائیں گے۔ اگلا، وضاحت کریں ' بٹن 'پہلے بٹن کے کلاس نام کے طور پر، اور تفویض کریں' بٹن 'اور' بٹن 2 دوسرے بٹن کی کلاسز کے طور پر۔

ایچ ٹی ایم ایل

< div >
< h1 > CSS کا استعمال کرتے ہوئے کلک ایونٹ کو غیر فعال کریں۔ < / h1 >
< بٹن کلاس = 'بٹن' > بٹن کو فعال کریں۔ < / بٹن >
< بٹن کلاس = 'بٹن بٹن 2' > غیر فعال بٹن < / بٹن >
< / div >

سی ایس ایس میں، ' بٹن ” کا استعمال HTML فائل میں بنائے گئے دونوں بٹنوں تک رسائی کے لیے کیا جاتا ہے۔ اگلا، بارڈر اسٹائل کو 'کے طور پر سیٹ کریں کوئی نہیں 'اور پیڈنگ کو بطور' دیں۔ 25px ' اس کے بعد، بٹن کے متن کا رنگ سیٹ کریں ' rgb(29, 6, 31) اور بٹن کا پس منظر بطور ' rgb(19, 192, 163) ' ہم ایک بٹن کا رداس بھی سیٹ کریں گے ' 5px '

سی ایس ایس

بٹن {
سرحد : کوئی نہیں ;
بھرتی : 25px ;
رنگ : آر جی بی ( 29 , 6 , 31 ) ;
پس منظر کا رنگ : آر جی بی ( 19 , 192 , 163 ) ;
سرحدی رداس : 5px ;
}

اس کے بعد، ہم دونوں بٹنوں پر :active pseudo-class کا اطلاق کریں گے۔ بٹن: فعال 'اور بٹن کا رنگ سیٹ کریں' rgb(200, 255, 0) ”:

بٹن : فعال {
پس منظر کا رنگ : آر جی بی ( 209 , 65 , 65 ) ;
}

نتیجے کے طور پر، آپ کو مندرجہ ذیل نتیجہ نظر آئے گا:

اب، ہم اگلے حصے پر جائیں گے جس میں ہم دوسرے بٹن کے لیے کلک ایونٹ کو غیر فعال کر دیں گے۔

ایسا کرنے کے لیے، استعمال کریں ' بٹن 2 HTML فائل میں بنائے گئے دوسرے بٹن تک رسائی حاصل کرنے کے لیے، اور اس کے بعد، پوائنٹر-ایونٹس پراپرٹی کی قدر کو بطور سیٹ کریں۔ کوئی نہیں ”:

بٹن 2 {
پوائنٹر واقعات : کوئی نہیں ;
}

پوائنٹر-ایونٹس کی خاصیت کا استعمال اور اس کی قدر کو نان پر سیٹ کرنا کلک ایونٹ کو غیر فعال کر دے گا، جسے درج ذیل آؤٹ پٹ میں دیکھا جا سکتا ہے:

ہم نے CSS کا استعمال کرتے ہوئے کلک ایونٹ کو غیر فعال کرنے کا سب سے آسان طریقہ فراہم کیا ہے۔

نتیجہ

HTML میں کلک ایونٹ کو غیر فعال کرنے کے لیے، ' پوائنٹر واقعات CSS کی خاصیت استعمال کی جاتی ہے۔ اس مقصد کے لیے، ایک HTML عنصر شامل کریں اور پوائنٹر-ایونٹس پراپرٹی کی قدر کو ' کوئی نہیں اس کے کلک ایونٹ کو غیر فعال کرنے کے لیے۔ اس مضمون میں اس کی مثال کے ساتھ CSS کا استعمال کرتے ہوئے کلک ایونٹ کو غیر فعال کرنے کا طریقہ بتایا گیا ہے۔