css - देखें:क्रोम डेवलपर टूल्स में होवर स्टेटस

मुझे लगता है कि यह क्रोम में अब कोई मुद्दा नहीं है लेकिन बस मामले में। जब मैं टैब कुंजी के साथ घूमता हूं तो मैंने डीओएम का निरीक्षण करने के लिए इस jQuery script को लिखा था।

यदि 'माउसओवर' का उपयोग करने के लिए बदला जाता है, तो ऐसा दिखाई देगा:

$("body *").on('mouseover', function(event) {       
    console.log(event.target);      
    inspect(event.target);
    event.stopPropagation();
});

जब भी आप उस तत्व पर कुछ क्लिक करते हैं या करते हैं जिसे आप रोकना चाहते हैं तो ईवेंट ईवेंट हैंडलर को हटाने के लिए आप इसे आसानी से संशोधित कर सकते हैं।

मुझे पता है कि मैं जो करता हूं वह काफी कामकाज है, हालांकि यह पूरी तरह से काम करता है और यही वह तरीका है जो मैं हर बार करता हूं।

फिर, इस तरह आगे बढ़ें:

• सबसे पहले सुनिश्चित करें कि क्रोम डेवलपर टूल्स अनदेखा है।
• फिर, देव उपकरण विंडो के किसी भी तरफ उस तत्व के बीच में जाएं जहां आप निरीक्षण करना चाहते हैं।

• अंत में, तत्व को होवर करें, राइट क्लिक करें और तत्व का निरीक्षण करें, अपने माउस को देव टूल्स विंडो में ले जाएं और आप अपने तत्व के साथ खेल सकेंगे: होवर सीएसएस।

चीयर्स!

संपादित करें: यह उत्तर बग फिक्स से पहले था, tnothcutt का जवाब देखें।

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

पीएस: मैंने आपके प्रश्न टैग में से एक पर यह कोशिश की।

मैं क्रोम के साथ एक मेनू hover राज्य डीबग कर रहा था और यह होवर राज्य कोड देखने में सक्षम था:

Elements पैनल में Toggle Element state बटन पर क्लिक करें और चुनें :hover ।

Scripts पैनल में दाएं निचले भाग में Event Listeners Breakpoints पर जाएं और Mouse -> mouseup चयन करें।

अब मेनू का निरीक्षण करें और इच्छित बॉक्स का चयन करें। जब आप माउस बटन छोड़ते हैं तो इसे रोकना चाहिए और Elements पैनल में चयनित तत्व होवर स्टेटस दिखाएं ( Styles सेक्शन देखें)।

अब आप psuedo-class नियम दोनों देख सकते हैं और उन्हें तत्वों पर मजबूर कर सकते हैं।

नियमों को देखने के लिए :hover स्टाइल फलक में :hover छोटे दाएं कोने में छोटे :hov टेक्स्ट पर क्लिक करें।

तत्व को मजबूर करने के लिए :hover स्थिति, राइट क्लिक करें।

क्रोम डेवलपर टूल्स शॉर्टकट्स में तत्व पैनल पर अतिरिक्त टिप्स।

मेरे मामले में, मैं बूटस्ट्रैप टूलटिप को डबग करना चाहता हूं। लेकिन ऊपर दिए गए तरीके मेरे लिए काम नहीं करते हैं। मुझे लगता है कि बूटस्ट्रैप ने इसे माउस इन / आउट इवेंट जैसे कुछ द्वारा कार्यान्वित किया है।

वैसे भी, जब मैं एक बटन पर होवर करता हूं, तो यह बटन के नीचे एक भाई HTML तत्व उत्पन्न करेगा, इसलिए मैं "डेवलपर टूल" विंडो के "तत्व" टैब में बटन के मूल तत्व का चयन करता हूं, बटन को होवर करता हूं, और "Ctrl + C" तो मैं स्रोत कोड पेस्ट कर सकता हूं जिसमें जेनरेट कोड शामिल है। अंत में जेनरेट कोड ढूंढें, और इसे "एलिमेंट्स" टैब में "HTML के रूप में संपादित करें" द्वारा स्रोत कोड में जोड़ें।

उम्मीद है कि यह किसी की मदद कर सकता है।

यदि यह मदद करता है, तो यह नवीनतम क्रोम (47.0.2526.106) में आसान लगता है:

तत्व का निरीक्षण करें और फिर बाएं गटर में तीन सफेद बिंदुओं पर क्लिक करें:

फिर इस ड्रॉपडाउन से वांछित तत्व स्थिति चुनें:

क्रोम में होवर स्थिति में बदलना बहुत आसान है, बस नीचे दिए गए चरणों का पालन करें:

1) अपने पेज पर राइट क्लिक करें और निरीक्षण का चयन करें

2) उस तत्व का चयन करें जिसे आप डीओएम में निरीक्षण करना चाहते हैं

3) पिन आइकन का चयन करें (एलिमेंट स्टेट टॉगल करें)

4) फिर होवर पर टिकटें

अब आप ब्राउज़र में चयनित डॉम की होवर स्थिति देख सकते हैं!

मुझे नहीं लगता कि ऐसा करने का एक तरीका है। मैंने एक फीचर अनुरोध जमा किया। यदि कोई तरीका है, तो Google पर डेवलपर्स इसे इंगित करेंगे और मैं अपना जवाब संपादित कर दूंगा। यदि नहीं, तो हमें इंतजार करना होगा और देखना होगा। (आप इस मुद्दे को वोट देने के लिए स्टार कर सकते हैं)

क्रोम प्रोजेक्ट सदस्य द्वारा टिप्पणी 1 : 10.0.620.0 में, स्टाइल पैनल दिखाता है: चयनित तत्व के लिए होवर शैलियों लेकिन सक्रिय नहीं: सक्रिय।

(इस पोस्ट के रूप में) वर्तमान स्थिर चैनल संस्करण 8.0.552.224 है।

आप बीटा चैनल या देव चैनल ( प्रारंभिक एक्सेस रिलीज चैनल देखें) के साथ Google क्रोम की अपनी स्थिर चैनल स्थापना को प्रतिस्थापित कर सकते हैं।

आप क्रोम की द्वितीयक स्थापना भी स्थापित कर सकते हैं जो देव चैनल की तुलना में अधिक अद्यतित है ।

... कैनरी बिल्ड को देव चैनल से भी अधिक बार अद्यतन किया जाता है और इसे रिलीज़ होने से पहले परीक्षण नहीं किया जाता है। क्योंकि कैनरी बिल्ड कभी-कभी अनुपयोगी हो सकता है, इसे आपके डिफ़ॉल्ट ब्राउज़र के रूप में सेट नहीं किया जा सकता है और Google Chrome के उपर्युक्त चैनलों के अतिरिक्त स्थापित किया जा सकता है। ...

किसी डोमेन पर अस्थायी रूप से जावास्क्रिप्ट को अवरुद्ध करने के लिए:

1. पता बार पर पते पर छोड़े गए बटन पर क्लिक करें (जो View site information )
2. JavaScript बगल में ड्रॉप-डाउन में, Always block on this site करें का चयन करें
3. पृष्ठ पुनः लोड करें