দেখুন: ক্রোম বিকাশকারী সরঞ্জামগুলিতে হোভারের অবস্থা


855

আমি দেখতে চাই :hoverএকটি নোঙ্গর আমি উপর ঝুলে আছি জন্য শৈলী ক্রোম । ইন ফায়ারবাগকে , একটি শৈলী ড্রপডাউন আমাকে একটি উপাদান জন্য বিভিন্ন রাজ্যের নির্বাচন করতে পারবেন না।

আমি ক্রোমে অনুরূপ কিছু খুঁজে পাচ্ছি না। আমি কিছু অনুপস্থিত করছি?


ভাল প্রশ্ন 'আমি কীভাবে ফায়ারবগে হোভার স্টাইলটি সম্পাদনা করতে চাইছিলাম
ক্রিস হালক্রো

1
আমি জানি যে এটি সমস্যার সম্পূর্ণ / নিখুঁত সমাধান নয়, তবে মাউসওভার ইভেন্টগুলির জন্য কাজ করবে এমন উত্তরের কোনও সমাধান খুঁজে পেল না। ব্রাউজারের সরঞ্জাম ব্যবহার করার সময় সাফারি ব্যবহার আপনাকে ঘোরাতে অনুমতি দেয়। সুতরাং, কেবল এই সমস্যার জন্য, অন্য একটি ব্রাউজার ব্যবহার বিবেচনা করুন।
12

উত্তর:


1255

এখন আপনি উভয়ই psuedo-শ্রেণীর নিয়ম দেখতে এবং উপাদানগুলিতে বাধ্য করতে পারেন।

:hoverস্টাইলস ফলকের মতো নিয়মগুলি দেখতে :hovউপরের ডানদিকে ছোট পাঠ্যে ক্লিক করুন ।

উপাদান রাষ্ট্র টগল করুন

কোনও উপাদানকে :hoverরাজ্যে জোর করতে , ডানদিকে ক্লিক করুন।

জোর উপাদান উপাদান

অতিরিক্ত টিপস উপাদান প্যানেল মধ্যে ক্রোম বিকাশকারী সরঞ্জামসমূহ শর্টকাট


3
কখন এটি পরিবর্তিত হয়েছে তা নিশ্চিত নয়, তবে আপনি এখনই অন্যান্য উপাদানগুলিতে (কেবল <a>উপাদানগুলি নয়) এলিমেন্ট স্টেটটি (উপাদানগুলির ফলক থেকে ) চাপতে পারেন।
ট্র্যাভিস নর্থক্যাট

3
এটি সিএসএসের জন্য কাজ করে: পরিবর্তনগুলি হোভার করুন, তবে আপনি জেএস ব্যবহার করে ওভারে পরিবর্তনগুলি করেন তবে তা নয়।
ম্যাথেজু 1460

এখানে একটি দ্রুত ভিডিও আমি একসঙ্গে ছুড়ে ফেলে প্রদর্শক আছে: ক্রোম 59-এ হোভার রাষ্ট্র যদি এটা যে কেউ সাহায্য করে youtu.be/Bklz3lGTFi8
RoccoB

54

সম্পাদনা: এই উত্তরটি বাগ ঠিক করার আগেই ছিল, দেখুন টনথক্টের উত্তর।

এটি কিছুটা জটিল ছিল, তবে এখানে যায়:

  • রাইট-ক্লিক করুন উপাদান, তবে আপনার মাউস পয়েন্টারটিকে উপাদান থেকে দূরে সরিয়ে দেবেন না, এটিকে হোভার অবস্থায় রাখুন।
  • হিট আপ তীর হিসাবে কীবোর্ডের মাধ্যমে উপাদানটি পরীক্ষা করুন এবং তারপরে কীটি চয়ন করুন।
  • ম্যাচ সিএসএস বিধিগুলির অধীনে বিকাশকারী সরঞ্জামগুলিতে সন্ধান করুন, আপনার দেখতে সক্ষম হওয়া উচিত: হোভার।

PS: আমি আপনার একটি প্রশ্ন ট্যাগ এ চেষ্টা করেছিলাম।


32

আমি আমার বুটস্ট্র্যাপ টুলটিপগুলিতে হোভারের অবস্থাটি দেখতে চেয়েছিলাম। জোরপূর্বক: ক্রোম দেব সরঞ্জামগুলিতে হোভার স্টেটটি প্রয়োজনীয় আউটপুট তৈরি করে নি, তবুও কনসোলের মাধ্যমে মাউসেন্টার ইভেন্টটি ট্রিগার করে ক্রোমের কৌশলটি কার্যকর হয়েছিল। পৃষ্ঠাটিতে jQuery উপস্থিত থাকলে আপনি চালাতে পারেন:

$('.YOUR-TOOL-TIP-CLASS').trigger('mouseenter');

বুটস্ট্র্যাপ টুলটিপসের জন্য হোভার বা মাউসেন্টার জোর করে


এটি সেরা উত্তর
আরগুন

20

ক্রোম বিকাশকারী সরঞ্জামগুলিতে হোভার স্টেট শৈলীগুলি দেখার বিভিন্ন উপায় রয়েছে ।

পদ্ধতি 01

এখানে চিত্র বর্ণনা লিখুন

পদ্ধতি 02

এখানে চিত্র বর্ণনা লিখুন

ফায়ারফক্স ডিফল্ট বিকাশকারী টোল সহ

এখানে চিত্র বর্ণনা লিখুন

ফায়ারব্যাগ সহ

এখানে চিত্র বর্ণনা লিখুন


9

যদি এটি সহায়তা করে তবে সর্বশেষতম Chrome (47.0.2526.106) এ এটি আরও সহজ বলে মনে হচ্ছে:

উপাদানটি পরীক্ষা করুন এবং তারপরে বাম জলের তিনটি সাদা বিন্দুতে ক্লিক করুন:
তিনটি সাদা বিন্দুতে ক্লিক করুন

তারপরে এই ড্রপডাউন থেকে পছন্দসই উপাদান রাষ্ট্রটি চয়ন করুন:
এই ড্রপডাউন


4

আমি মনে করি না এটি করার কোনও উপায় আছে। আমি একটি বৈশিষ্ট্য অনুরোধ জমা দিয়েছেন । যদি কোনও উপায় থাকে, গুগলের বিকাশকারীরা তাৎক্ষণিকভাবে এটি নির্দেশ করবে এবং আমি আমার উত্তরটি সম্পাদনা করব। তা না হলে আমাদের অপেক্ষা করতে হবে এবং দেখতে হবে। (আপনি এটিকে ভোট দেওয়ার জন্য সমস্যাটি তারকাচিহ্নিত করতে পারেন)


ক্রোম প্রকল্পের সদস্যের দ্বারা মন্তব্য করা 1 : 10.0.620.0 এ, স্টাইলস প্যানেলটি নির্বাচিত উপাদানগুলির জন্য: হোভার শৈলীগুলি দেখায় কিন্তু সক্রিয় নয়: সক্রিয়।


(এই পোস্ট হিসাবে) বর্তমান স্থিতিশীল চ্যানেল সংস্করণ 8.0.552.224।

আপনি গুগল ক্রোমের আপনার স্থিতিশীল চ্যানেল ইনস্টলেশনটি বিটা চ্যানেল বা দেব চ্যানেল ( আর্লি অ্যাক্সেস রিলিজ চ্যানেলগুলি দেখুন ) দিয়ে প্রতিস্থাপন করতে পারেন ।

আপনি ক্রোমের একটি গৌণ ইনস্টলেশনও ইনস্টল করতে পারেন যা দেব চ্যানেলের চেয়েও আধুনিক

... ক্যানারি বিল্ডটি দেব চ্যানেলের চেয়েও বেশি ঘন ঘন আপডেট হয় এবং প্রকাশ হওয়ার আগে এটি পরীক্ষা করা হয় না। কেননা ক্যানারি বিল্ডটি কখনও কখনও অকার্যকর হতে পারে, এটি আপনার ডিফল্ট ব্রাউজার হিসাবে সেট করা যায় না এবং গুগল ক্রোমের উপরের চ্যানেলগুলির পাশাপাশি ইনস্টল করা যেতে পারে। ...


দুর্দান্ত তদন্ত। আমি সর্বশেষ ডেভ বিল্ডটি রক করছি (10.0.612.3) তাই আমি কেবল কিছুটা অপেক্ষা করব এবং আশা করি আমি দেখতে পাব: ন্যাওড়াটি হোভার করুন!
বেন

4

আমি জানি যে আমি যা করি তা পুরোপুরি কার্যকর, তবে এটি নিখুঁতভাবে কাজ করে এবং আমি প্রতিদিন এটি করি।

ক্রোম বিকাশকারী সরঞ্জামগুলি আনডক করুন

তারপরে, এভাবে এগিয়ে যান:

  • প্রথমে নিশ্চিত করুন ক্রোম বিকাশকারী সরঞ্জামগুলি আনডকড রয়েছে।
  • তারপরে, আবদ্ধ হওয়ার সময় আপনি যে উপাদানটি পরিদর্শন করতে চান তার মাঝখানে কেবলমাত্র ডিভাইস উইন্ডোটির যে কোনও দিকটি সরান।

উপাদান উপর ঘোরা

  • শেষ অবধি, উপাদানটি হোভার করুন, ডান ক্লিক করুন এবং উপাদানটি পরীক্ষা করুন, আপনার মাউসটিকে ডিভাইস উইন্ডোতে সরিয়ে ফেলুন এবং আপনি আপনার উপাদানটির সাথে খেলতে সক্ষম হবেন: সিএসএস হোভার করুন।

চিয়ার্স!


1
একটি মন্তব্য যুক্ত করতে যাচ্ছি যাতে আমি এটি আবার খুঁজে পেতে পারি, কারণ আমি জানি যে এটির আমার প্রয়োজন হবে! অপ্রত্যাশিত তৃতীয় পক্ষের ইউআই প্লাগইনগুলির জন্য বিশেষত গুরুত্বপূর্ণ।
cfranklin

3

আমি hoverক্রোমের সাথে একটি মেনু স্থিতি ডিবাগ করছিলাম এবং হোভার স্টেট কোডটি দেখতে সক্ষম হয়ে এটি করলাম:

ইন Elementsপ্যানেল উপর ক্লিক Toggle Element stateবাটন নির্বাচন :hover

ইন Scriptsপ্যানেলে যেতে Event Listeners Breakpointsডান নীচে বিভাগে নির্বাচন Mouse -> mouseup

এখন মেনুটি পরীক্ষা করুন এবং আপনি যে বাক্সটি চান তা নির্বাচন করুন আপনি যখন মাউস বোতামটি ছেড়ে দিবেন তখন এটি থামানো উচিত এবং আপনাকে Elementsপ্যানেলে নির্বাচিত উপাদানটি হোভারের অবস্থাটি দেখায় ( Stylesবিভাগটি দেখুন)।


2

পরিবর্তন হোভার Chrome এ অবস্থা বেশ সহজ, শুধু নীচের এই পদক্ষেপগুলি অনুসরণ করুন:

1) আপনার পৃষ্ঠায় ডান ক্লিক করুন এবং পরিদর্শন নির্বাচন করুন

এখানে চিত্র বর্ণনা লিখুন

2) উপাদান আপনি পরিদর্শন করে দিন নির্বাচন করুন করে DOM

এখানে চিত্র বর্ণনা লিখুন

3) পিন আইকনটি নির্বাচন করুন এখানে চিত্র বর্ণনা লিখুন (টগল এলিমেন্ট স্টেট)

4) তারপর টিক্ হোভার

এখন আপনি ব্রাউজারে নির্বাচিত ডিওএমের হোভার অবস্থা দেখতে পাবেন !


1

আমি বাবিকেরের দ্বারা প্রস্তাবিত নীচের পদক্ষেপগুলি অনুসরণ করে শৈলীটি দেখতে পেয়েছি - "রাইট-ক্লিক উপাদান, তবে আপনার মাউস পয়েন্টারটিকে উপাদান থেকে দূরে সরিয়ে নাও, অবস্থায় রাখুন। হিট-আপ তীর হিসাবে কীবোর্ডের মাধ্যমে উপাদানটি পরীক্ষা করুন এবং তারপরে কী লিখুন।

স্টাইল পরিবর্তন করার জন্য উপরের পদক্ষেপগুলি অনুসরণ করুন এবং তারপরে - কীবোর্ডে ctrl + TAB টিপে আপনার ব্রাউজার ট্যাবটি পরিবর্তন করুন। তারপরে আপনি যে ট্যাবটি ডিবাগ করতে চান তাতে ফিরে ক্লিক করুন। আপনার হোভার স্ক্রিনটি এখনও থাকবে। এখন সাবধানে আপনার মাউসটিকে বিকাশকারী সরঞ্জাম অঞ্চলে নিয়ে যান।


1
আপনার মাউসকে হোভার অবস্থায় রাখার দরকার নেই
জাচারি নিয়েবেল

1

আমার ক্ষেত্রে, আমি বুটস্ট্র্যাপ টুলটিপটি ডাব করতে চাই। তবে উপরের পদ্ধতিগুলি আমার পক্ষে কাজ করে না। আমার ধারণা বুটস্ট্র্যাপ এটিকে মাউস ইন / আউট ইভেন্টের মতো কিছু দ্বারা প্রয়োগ করেছে।

যাইহোক, আমি যখন একটি বোতামে ঘুরে দেখি, এটি বোতামের নীচে একটি ভাই এইচটিএমএল উপাদান উত্পন্ন করবে, তাই আমি "বিকাশকারী সরঞ্জাম" উইন্ডোর "এলিমেন্টস" ট্যাবটিতে বোতামটির মূল উপাদানটি নির্বাচন করব, বোতামটি হোভার করুন, এবং "Ctrl + C", তারপরে আমি উত্স কোডটি পেস্ট করতে পারি যা উত্পন্ন কোড রয়েছে। সর্বশেষ উত্পন্ন কোডটি সন্ধান করুন এবং "উপাদানসমূহ" ট্যাবে "HTML হিসাবে সম্পাদনা করুন" দ্বারা উত্স কোডে এটি যুক্ত করুন।

আশা করি এটি কারও সাহায্য করতে পারে।


0

আমি মনে করি এটি ক্রোমে আর কোনও সমস্যা নয় তবে কেবল ক্ষেত্রে। আমি যখন টিএবি কী নিয়ে ঘোরাফেরা করি তখন ডওম পরিদর্শন করার জন্য এই jQuery স্ক্রিপ্টটি লিখেছিলাম ।

যদি 'মাউসওভার' ব্যবহার করতে পরিবর্তিত হয় তবে দেখতে এটির মতো হবে:

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

আপনি যখনই থামাতে চান বা যখন কোনও উপাদানকে ক্লিক করেন বা কিছু করেন তখন ইভেন্ট হ্যান্ডলারটি সরাতে আপনি সহজেই এটি সংশোধন করতে পারেন।

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.