होवर कोड देखने के लिए क्रोम वेब इंस्पेक्टर का उपयोग कैसे करें

Question

कोड देखने के लिए क्रोमेस वेब इंस्पेक्टर का उपयोग करना बहुत उपयोगी है। लेकिन आप एक बटन के लिए हॉवर कोड कैसे देखते हैं? आपको बटन पर माउस को हॉवर करना होगा और इस तरह से वह (माउस) इंस्पेक्टर में उपयोग नहीं कर सकता है। क्या निरीक्षक में इसे पूरा करने के लिए कोई शॉर्टकट या अन्य तरीके हैं?

Comments

यह इस का एक डुप्लिकेट नहीं है? stackoverflow.com/questions/4515124/…

— मिश्रण

क्या इससे आपके सवाल का जवाब मिलता है? देखें: क्रोम डेवलपर टूल्स में होवर स्टेट

— TylerH

Answer 1

अब आप दोनों छद्म श्रेणी की शैली के नियम देख सकते हैं और उन्हें तत्वों पर मजबूर कर सकते हैं।

:hoverस्टाइल्स फलक जैसे नियमों को देखने के लिए ऊपर दाईं ओर स्थित छोटे डॉटेड बॉक्स बटन पर क्लिक करें।

किसी तत्व को :hoverराज्य में बाध्य करने के लिए , उसे राइट क्लिक करें।

वैकल्पिक रूप से, आप स्क्रिप्ट पैनल में ईवेंट श्रोता ब्रेकपॉइंट साइडबार फलक का उपयोग कर सकते हैं और माउसओवर हैंडलर में रुक सकते हैं।

Comments

Chrome 48 (और पहले का) में, उस बिंदीदार बॉक्स को एक पुशपिन आइकन से बदल दिया गया है, जो कहता है कि टॉगल एलीमेंट स्टेट जब आप उस पर मंडराते हैं। फिर आप ड्रॉप डाउन सूची से "होवर" का चयन करें।

— उसी रात

Answer 2

वैकल्पिक रूप से, आप स्क्रिप्ट पैनल में ईवेंट श्रोता ब्रेकपॉइंट साइडबार फलक का उपयोग कर सकते हैं और माउसओवर हैंडलर में रुक सकते हैं।

Answer 3

यह थोड़ा कष्टप्रद है, लेकिन आपको तत्व पर राइट क्लिक करने की आवश्यकता है, और फिर, लिंक पर अपने माउस को रखकर, अपने कीबोर्ड का उपयोग करके 'इंसपेक्ट एलिमेंट' लिंक का चयन करें और एंटर दबाएं। यह आपको चयनित तत्व के लिए hover छद्म वर्ग के लिए सीएसएस दिखाना चाहिए।

यहाँ उम्मीद है कि वे भविष्य के निर्माण में इसे थोड़ा आसान बनाते हैं।

Comments

जानकर अच्छा लगा, लेकिन हाँ यह बहुत निराशाजनक है कि माउस को लिंक पर मँडराते रहने की आवश्यकता है ... यहां तक ​​कि जब आप केवल कीबोर्ड का उपयोग करके निरीक्षण तत्व विंडो में चारों ओर प्रहार करते हैं। क्या शोर है!

— चाड शुल्त्स

तत्व को राज्य के लिए मजबूर करने की वास्तविक पूरी प्रक्रिया :hover, ( as in the accepted answer), तत्व पर राइट-क्लिक करने,> निरीक्षण करने और वहां सूचक को रखने के लिए भी प्राप्त की जाती है, और फिर छद्म कोड की जांच करने के लिए कीबोर्ड कुंजियों का उपयोग करें .. इस काम के विकल्प के लिए धन्यवाद .... तो वास्तव में उपद्रव नहीं है !

— :)

Answer 4

क्रोम में:

आप किसी तत्व पर माउसओवर भी कर सकते हैं और फिर CTRL+SHIFT+Cउस तत्व का निरीक्षण करने के लिए क्लिक कर सकते हैं ।

फ़ायरफ़ॉक्स में:

फायरबग में:

स्रोत: https://stackoverflow.com/a/11272205/2165415

Answer 5

मुझे यकीन नहीं है कि मैं आपके प्रश्न को ठीक से समझता हूं, लेकिन यदि आप ईवेंट हैंडलर कोड देखना चाहते हैं तो आप केवल तत्व का निरीक्षण कर सकते हैं और एलीमेंट पैनल के इवेंट श्रोताओं के साइडबार फलक को देख सकते हैं। एक और तरीका सिर्फ स्क्रिप्स पैनल में प्रेस पॉज़ बटन है और बस तत्व को होवर करें। डीबगर पहले ईवेंट हैंडलर के पहले निर्देश पर रुक जाएगा।

Comments

क्या आप यह कैसे कर सकते हैं इसके बारे में बस थोड़ा अधिक विशिष्ट हो सकता है? एक विशिष्ट मामला एक बटन होगा जिसे मैं पसंद करता हूं, और यह देखना चाहता हूं कि कैसे होवरिंग प्रभाव उसी तरीके से पूरा किया जाता है जैसे कि सामान्य निरीक्षण।

— बो।

Answer 6

कृपया उत्तर के लिए नीचे दिए गए लिंक पर एक नज़र डालें

देखें: Chrome डेवलपर टूल में होवर स्थिति

Comments

लिंक समाप्त हो सकता है और आपके उत्तर को बेकार कर सकता है। इसे रोकने के लिए कृपया अपने उत्तर में कुछ जानकारी प्रदान करें।

— बोजिदार स्टेंचव