আমি কীভাবে পরীক্ষা করব যে মাউসটি jQuery এর কোনও উপাদানটির উপরে রয়েছে?

Question

আমি যে অনুপস্থিত তা jQuery এ করার কি দ্রুত এবং সহজ উপায় আছে?

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

আমি এই জাতীয় কিছু করতে চাই, যদি কেবল "ইসমাউসওভার" ফাংশন থাকত:

function hideTip(oi) {
    setTimeout(function() { if (!IsMouseOver(oi)) $(oi).fadeOut(); }, 100);
}

Comments

বেশিরভাগ উদ্দেশ্যে দেওয়া উত্তরগুলি যথেষ্ট, তবে মাউসিন / আউট পর্যাপ্ত না থাকার ক্ষেত্রেও এমন ঘটনা রয়েছে। উদাহরণস্বরূপ, যখন মাউস মেনু হেড বা মেনু বডির উপরের বেশি থাকে না তখন একটি মেনু লুকিয়ে রাখা।

— মার্কাস ডাউনিং

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

— মথমন্সটারম্যান

# মার্কাস: যদি কোনও মেনু লুকিয়ে রাখেন তবে এর থেকে উত্তম উপায় কী?

— কোড্রামামা

আমার উত্তর দেখুন stackoverflow.com/questions/9827095/…

— সান

যদি সেরা উত্তরটি সমাধান হিসাবে চিহ্নিত করা হত তবে আমি এটি দিয়েছি।

— বিবিসিঞ্জার

Answer 1

ফিডআউট এবং অবজেক্টটিতে ডেটাতে ফেরতের মান সঞ্চয় করতে মাউসআউটটিতে একটি টাইমআউট সেট করুন। তারপরে অনমাউসওভার, ডেটাতে কোনও মান থাকলে টাইমআউট বাতিল করুন।

ফেডআউটের কলব্যাকের ডেটা সরান।

মাউসেন্টার / মাউসলেভ ব্যবহার করা আসলে কম ব্যয়বহুল কারণ যখন বাচ্চারা মাউসওভার / মাউসআউট আগুন দেয় তখন তারা মেনুতে আগুন দেয় না।

Comments

@ আর্থার ঠিক এখানেই করেছেন, আপনার কি আরও তথ্যের দরকার আছে? stackoverflow.com/a/1670561/152640

— mothmonsterman

Answer 2

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

$("someelement").mouseenter(function(){
    clearTimeout($(this).data('timeoutId'));
    $(this).find(".tooltip").fadeIn("slow");
}).mouseleave(function(){
    var someElement = $(this),
        timeoutId = setTimeout(function(){
            someElement.find(".tooltip").fadeOut("slow");
        }, 650);
    //set the timeoutId, allowing us to clear this trigger if the mouse comes back over
    someElement.data('timeoutId', timeoutId); 
});

Answer 3

একটি পরিষ্কার এবং মার্জিত হোভার চেক:

if ($('#element:hover').length != 0) {
    // do something ;)
}

Comments

ঠিক - এটি নির্বাচিত উত্তর হওয়া উচিত! যাইহোক, এখানে এটির জন্য একটি

— ঝলক

কীভাবে কোনও উপাদান আটকানো হয়েছে

— কেভিন হুইলার

Answer 4

সতর্কতা: is(':hover')jquery 1.8+ এ অবচয় করা হয়েছে। একটি সমাধানের জন্য এই পোস্টটি দেখুন ।

আপনি এই উত্তরটিও ব্যবহার করতে পারেন: https://stackoverflow.com/a/6035278/8843 পরীক্ষা করার জন্য মাউসটি কোনও উপাদান হওর করে:

$('#test').click(function() {
    if ($('#hello').is(':hover')) {
        alert('hello');
    }
});

Comments

এটি কোথাও নথিভুক্ত করা হয়নি (আফিক) এবং গতিশীলভাবে প্রদর্শিত উপাদানগুলির সাথে (মেনুর মতো) সঠিক বলে মনে হচ্ছে না ..

— ল্যাম্বিনেটর

jQuery 1.9.1 হিসাবে ভাঙ্গা !! পরিবর্তে আইভোর সমাধানটি ব্যবহার করুন

— ম্যাথহেডইনক্লাউডস 11:51

আনকড ত্রুটি: সিনট্যাক্স ত্রুটি, অচেনা এক্সপ্রেশন: অসমর্থিত ছদ্ম: হোভার

— জুলিও মেরিনস

সতর্কতা : :hoverকোনও বৈধ jQuery নির্বাচনকারী নয়: api.jquery.com/category/selectors (উত্স: bugs.jquery.com/ticket/11574 )

— পাং

এটি এখনও কাজ করে যদি ব্রাউজারটি সমর্থন করেdocument.querySelectorAll(':hover')

— ইকুয়েসেল

Answer 5

hoverম্যানুয়ালি ট্র্যাক রাখতে আপনি jQuery এর ইভেন্টটি ব্যবহার করতে পারেন :

$(...).hover(
    function() { $.data(this, 'hover', true); },
    function() { $.data(this, 'hover', false); }
).data('hover', false);

if ($(something).data('hover'))
    //Hovered!

Comments

কেন ডেটা ব্যবহার করবেন () এবং যোগ / অপসারণক্লাস () যোগ করবেন না? একজনের চেয়ে অন্য পারফরম্যান্স কি অন্যরকম?

— সাইকোটিক

@psychotik: হ্যাঁ; $.dataস্ট্রিং ম্যানিপুলেশন জড়িত না।

— স্লাকস

: আমি কোন ক্লাসে এই আবৃত stackoverflow.com/questions/1273566/...

— ripper234

Answer 6

আমার ঠিক এর মতো কিছু দরকার ছিল (আরও কিছু জটিল পরিবেশে এবং সমাধানের জন্য অনেকগুলি 'মাউসেনটার' এবং 'মাউসেলিভস' সঠিকভাবে কাজ করছে না) তাই আমি একটি সামান্য jquery প্লাগইন তৈরি করেছিলাম যা পদ্ধতিটি ইসমাউসওভারকে যুক্ত করে। এটি এখনও পর্যন্ত বেশ ভাল কাজ করেছে।

//jQuery ismouseover  method
(function($){ 
    $.mlp = {x:0,y:0}; // Mouse Last Position
    function documentHandler(){
        var $current = this === document ? $(this) : $(this).contents();
        $current.mousemove(function(e){jQuery.mlp = {x:e.pageX,y:e.pageY}});
        $current.find("iframe").load(documentHandler);
    }
    $(documentHandler);
    $.fn.ismouseover = function(overThis) {  
        var result = false;
        this.eq(0).each(function() {  
                var $current = $(this).is("iframe") ? $(this).contents().find("body") : $(this);
                var offset = $current.offset();             
                result =    offset.left<=$.mlp.x && offset.left + $current.outerWidth() > $.mlp.x &&
                            offset.top<=$.mlp.y && offset.top + $current.outerHeight() > $.mlp.y;
        });  
        return result;
    };  
})(jQuery);

তারপরে নথির যে কোনও স্থানে আপনি এটিকে কল করুন এবং এটি সত্য বা মিথ্যা প্রত্যাবর্তন করবে:

$("#player").ismouseover()

আমি এটি আই 7 +, ক্রোম 1+ এবং ফায়ারফক্স 4 এ পরীক্ষা করেছি এবং সঠিকভাবে কাজ করছি।

Comments

এটি মাউসেন্টারে (ক্রোম) কাজ করছে বলে মনে হচ্ছে না - codepen.io/anon/pen/kcypB

— wrygiel

পারফেক্ট। তাত্ক্ষণিকভাবে অনুরোধ করা ফাংশন এক্সপ্রেশন (আইআইএফই) যা অস্বচ্ছতার ওভারলে দিয়ে উপাদানগুলির নীচে লক্ষ্যবস্তুগুলির সমাধান করে। উজ্জ্বল! এই জন্য আপনাকে ধন্যবাদ.

— আলেকজান্ডার ডিকসন

Answer 7

JQuery এ আপনি .is (': হোভার') ব্যবহার করতে পারেন, তাই

function IsMouseOver(oi)
{
   return $(oi).is(':hover');
}

ওপিতে অনুরোধ করা ফাংশনটি এখন সরবরাহ করার সবচেয়ে সংক্ষিপ্ত উপায় হবে।

দ্রষ্টব্য: উপরেরগুলি IE8 বা তার চেয়ে কম ক্ষেত্রে কাজ করে না

আইই 8-তে কাজ করে এমন কম সংক্ষিপ্ত বিকল্প হিসাবে (যদি আমি আইই 9 এর আই 88 মডাসকে বিশ্বাস করতে পারি), এবং এটি $(...).hover(...)সমস্ত জায়গা জুড়েই ট্রিগার না করেই করে , বা উপাদানটির জন্য কোনও নির্বাচককে জানতে হবে না (যার ক্ষেত্রে আইভোর উত্তর সহজ):

function IsMouseOver(oi)
{
    return oi.length && 
           oi.parent()
             .find(':hover')
             .filter(function(s){return oi[0]==this})
             .length > 0;
}

Comments

এটি বৈধ jQuery নির্বাচক নয়! লোকগুলিকে এই পদ্ধতির পরামর্শ দেওয়া বন্ধ করতে হবে। এটি সর্বত্র এবং আই 8 এর সাথে সামঞ্জস্যপূর্ণ নয়।

— সান্নে

আইই 8 এর সমাধান পেতে আমার অন্য উত্তরটি দেখুন

— সান্নে

@Sanne এটা জানতে আগ্রহী কারণ $(':hover') নেই IE8 করছি না। এটি একটি বৈধ CSS2 সিউডো নির্বাচনকারী, সুতরাং এটি কাজ করা উচিত।

— টাওয়ার

Answer 8

আমি স্ল্যাक्सের ধারণা নিয়েছি এবং এটি একটি ছোট ক্লাসে জড়িয়েছি ।

function HoverWatcher(selector){
  this.hovering = false;
  var self = this; 

  this.isHoveringOver = function() { 
    return self.hovering; 
  } 

    $(selector).hover(function() { 
      self.hovering = true; 
    }, function() { 
      self.hovering = false; 
    }) 
} 

var box1Watcher = new HoverWatcher('#box1');
var box2Watcher = new HoverWatcher('#box2');



$('#container').click(function() {
  alert("box1.hover = " + box1Watcher.isHoveringOver() +
        ", box2.hover = " + box2Watcher.isHoveringOver());
});

Answer 9

ভবিষ্যতের এটির সন্ধানকারীদের জন্য কেবলমাত্র FYI।

আমি একটি jQuery প্লাগইন তৈরি করেছি যা এটি এবং আরও অনেক কিছু করতে পারে। আমার প্লাগইনে, সমস্ত উপাদানগুলি পেতে কার্সারটি বর্তমানে আচ্ছাদিত রয়েছে, কেবল নিম্নলিখিতটি করুন:

$.cursor("isHover"); // will return jQ object of all elements the cursor is 
                     // currently over & doesn't require timer

যেমনটি আমি উল্লেখ করেছি, এটিতে অন্যান্য প্রচুর ব্যবহার রয়েছে যেমন আপনি দেখতে পাচ্ছেন

jsFiddle এখানে পাওয়া যায়

Answer 10

আমি যেমন মন্তব্য করতে পারি না, তাই উত্তর হিসাবে এটি লিখব!

অনুগ্রহ করে সিএসএস নির্বাচক ": হোভার" এবং হোভার ইভেন্টের মধ্যে পার্থক্যটি বুঝুন!

": হোভার" একটি সিএসএস নির্বাচক এবং সত্যই যখন এটির মতো ব্যবহার করা হয় তখন ইভেন্টটির সাথে সরানো হয়েছিল $("#elementId").is(":hover") , তবে এর অর্থ jQuery ইভেন্ট হোভারের সাথে এর আসলে কোনও সম্পর্ক নেই।

আপনি যদি কোড $("#elementId:hover") তবে উপাদানটি কেবলমাত্র তখনই নির্বাচন করা হবে যখন আপনি মাউস নিয়ে ঘোরাবেন। উপরোক্ত বিবৃতিটি খাঁটি এবং লিট সিএসএস নির্বাচনের মাধ্যমে এই উপাদানটি নির্বাচন করা হিসাবে সমস্ত jQuery সংস্করণগুলির সাথে কাজ করবে।

অন্যদিকে ইভেন্টটি হোভার যা হয়

$("#elementId").hover(
     function() { 
         doSomething(); 
     }
); 

এখানে jQuery ওয়েবসাইট থেকে রাজ্যে সত্যই jQuery 1.8 হিসাবে অবচিত হয়েছে:

ইভেন্টের নাম "হোভার" ব্যবহার করা হলে ইভেন্টের সাবসিস্টেম এটিকে ইভেন্টের স্ট্রিংয়ের "মাউসেন্টার মাউসলেভ" এ রূপান্তর করে। এটি বেশ কয়েকটি কারণে বিরক্তিকর:

শব্দার্থবিজ্ঞান: হাওরিং হ'ল মাউস কোনও উপাদান প্রবেশ করানো এবং রেখে যাওয়ার মতো নয়, এটি গুলি চালানোর আগে কিছুটা হ্রাস বা বিলম্ব বোঝায়। ইভেন্টের নাম: সংযুক্ত হ্যান্ডলারের দ্বারা ফিরিয়ে নেওয়া ইভেন্ট.প্রকারটি হোভার নয়, তবে মাউসেন্টার বা মাউসলেভ। অন্য কোনও ইভেন্ট এটি করে না। "হোভার" নামটি সহ-বেছে নেওয়া: "হোভার" নামের সাথে কোনও ইভেন্ট সংযুক্ত করা এবং .trigger ("হোভার") ব্যবহার করে এটি ফায়ার করা সম্ভব নয়। দস্তাবেজগুলি ইতিমধ্যে এই নামটিকে "নতুন কোডের জন্য দৃ strongly়ভাবে নিরুৎসাহিত করেছে" বলে ডাকে, আমি এটি অফিসিয়ালভাবে ১.৮ এর জন্য হ্রাস করতে চাই এবং অবশেষে এটি মুছে ফেলতে চাই।

তারা কেন ব্যবহারটি সরিয়ে ফেলল তা (": হোভার") অস্পষ্ট তবে ওহ ভাল, আপনি এখনও এটি উপরের মতো ব্যবহার করতে পারেন এবং এটি ব্যবহারের জন্য এখানে কিছুটা হ্যাক।

(function ($) {
   /** 
    * :hover selector was removed from jQuery 1.8+ and cannot be used with .is(":hover") 
    * but using it in this way it works as :hover is css selector! 
    *
    **/
    $.fn.isMouseOver = function() {
        return $(this).parent().find($(this).selector + ":hover").length > 0;
    };
})(jQuery);

ওহ এবং আমি টাইমআউট সংস্করণটিকে পুনরায় ক্ষতিপূরণ দেব না কারণ এটি অনেক জটিলতা নিয়ে আসে , অন্য কোনও উপায় না থাকলে এই ধরণের জিনিসগুলির জন্য টাইমআউট কার্যকরীতা ব্যবহার করুন এবং আমাকে বিশ্বাস করুন, সব ক্ষেত্রে 95% শতাংশে অন্য উপায় আছে !

আশা করি আমি সেখানে কয়েকজনকে সাহায্য করতে পারব।

গ্রেটজ অ্যান্ডি

Answer 11

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

এটি আমাকে কিছুটা সময় নিয়েছে তবে আমি আপনার উভয় পরামর্শই নিয়েছি এবং এমন কিছু নিয়ে এসেছি যা আমার পক্ষে কার্যকর হবে।

এখানে একটি সরলীকৃত (তবে কার্যকরী) উদাহরণ:

$("[HoverHelp]").hover (
    function () {
        var HelpID = "#" + $(this).attr("HoverHelp");
        $(HelpID).css("top", $(this).position().top + 25);
        $(HelpID).css("left", $(this).position().left);
        $(HelpID).attr("fadeout", "false");
        $(HelpID).fadeIn();
    },
    function () {
        var HelpID = "#" + $(this).attr("HoverHelp");
        $(HelpID).attr("fadeout", "true");
        setTimeout(function() { if ($(HelpID).attr("fadeout") == "true") $(HelpID).fadeOut(); }, 100);
    }
);

এবং তারপরে কিছু পাঠ্যে এই কাজটি করার জন্য আমার যা করতে হবে তা কেবল:

<div id="tip_TextHelp" style="display: none;">This help text will show up on a mouseover, and fade away 100 milliseconds after a mouseout.</div>

This is a <span class="Help" HoverHelp="tip_TextHelp">mouse over</span> effect.

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

Answer 12

আমি এটির জন্য প্রচুর সময়সামগ্রী দেখতে পাচ্ছি, তবে একটি ইভেন্টের প্রসঙ্গে আপনি কি এই জাতীয় স্থানাঙ্কের দিকে তাকাতে পারবেন না ?:

function areXYInside(e){  
        var w=e.target.offsetWidth;
        var h=e.target.offsetHeight;
        var x=e.offsetX;
        var y=e.offsetY;
        return !(x<0 || x>=w || y<0 || y>=h);
}

প্রসঙ্গের উপর নির্ভর করে, আপনাকে ওয়্যারআইএনএসাইড (ই) কল করার আগে আপনাকে (এটি == e.target) নিশ্চিত করতে হবে।

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

সম্পাদনা: এটি একটি দুর্দান্ত ধারণা, তবে ধারাবাহিকভাবে যথেষ্ট কাজ করে না। সম্ভবত কিছু ছোট টুইট।

Answer 13

jQueryকোনও শিশু ডিভের একটি নির্দিষ্ট শ্রেণি রয়েছে কিনা তা দিয়ে আপনি পরীক্ষা করতে পারেন। তারপরে class শ্রেণীর প্রয়োগের মাধ্যমে যখন আপনি একটি নির্দিষ্ট ডিভকে মাউসটি আউট ও আউট করেন, আপনি পরীক্ষা করতে পারেন যে আপনার মাউসটি এটির উপরে রয়েছে কিনা, এমনকি আপনি পৃষ্ঠাতে কোনও ভিন্ন উপাদানকে মাউস করলেও এইভাবে অনেক কম কোড থাকে। আমি এটি ব্যবহার করেছি কারণ আমার একটি পপ-আপে ডিভের মধ্যে ফাঁকা স্থান ছিল এবং আমি যখন পপ আপ থেকে সরে যাই তখনই আমি পপ আপটি বন্ধ করতে চেয়েছিলাম, যখন আমি পপ-আপের ফাঁকা জায়গাগুলির উপর দিয়ে আমার মাউসটি সরিয়ে রাখতাম না। সুতরাং আমি কনটেন্ট ডিভের উপর একটি মাউসওভার ফাংশনটি কল করেছি (যা পপ আপ শেষ হয়েছিল), তবে এটি কেবল তখনই ঘনিষ্ঠ ফাংশনটি ট্রিগার করবে যখন আমি কনটেন্ট ডিভের উপর দিয়ে থামিয়েছিলাম, এবং পপ আপের বাইরে ছিল!

$ ( "। পপ-আপ")। মাউসওভার (ফাংশন (ঙ)
    {
    $ (এই) .addClass ( "উপর");
    });

$ ( "। পপ-আপ")। Mouseout (ফাংশন (ঙ)
    {
    $ (এই) .removeClass ( "উপর");
    });


$ ( "# MainContent")। মাউসওভার (ফাংশন (ঙ) {
            যদি (! $ ("। প্রসারিত")। হ্যাশ ক্লাস ("ওভার")) {
            Drupal.dhtmlMenu.toggleMenu ($ () "প্রসারিত করা হয়েছে।");
        }
    });

Answer 14

এটি করার সহজ উপায় এটি হবে!

  function(oi) 
  {
   if(!$(oi).is(':hover')){$(oi).fadeOut(100);}
  }

Answer 15

এখানে এমন একটি কৌশল রয়েছে যা jquery এ নির্ভর করে না এবং দেশীয় DOM matches API ব্যবহার করে । এটি ব্রাউজারগুলি আইই 9-তে ফিরে যেতে সহায়তা করতে বিক্রেতার উপসর্গ ব্যবহার করে। সম্পূর্ণ বিবরণের জন্য ক্যানিজ ডটকমের ম্যাচ সিলেক্টরটি দেখুন ।

প্রথমে ম্যাচস্লেেক্টর ফাংশন তৈরি করুন, এর মতো:

var matchesSelector = (function(ElementPrototype) {
var fn = ElementPrototype.matches ||
          ElementPrototype.webkitMatchesSelector ||
          ElementPrototype.mozMatchesSelector ||
          ElementPrototype.msMatchesSelector;

return function(element, selector) {
  return fn.call(element, selector);
};

})(Element.prototype);

তারপরে, হোভার সনাক্ত করতে:

var mouseIsOver = matchesSelector(element, ':hover');

Answer 16

আপনার প্রয়োজন হতে পারে এমন সমস্ত বিবরণ সহ আমি অন্য প্রশ্নের উত্তর দিয়েছি:

JQuery সহ উপাদানটির উপর ঘুরে বেড়াচ্ছে কিনা তা সনাক্ত করুন (লেখার সময় 99 টি upvotes রয়েছে)

মূলত, আপনি যেমন কিছু করতে পারেন:

var ishovered = oi.is(":hover");

এটি কেবল তখনই কাজ করে যদি oiকোনও একক উপাদান যুক্ত jQuery অবজেক্ট থাকে। যদি একাধিক উপাদান মিলে যায় তবে আপনাকে প্রতিটি উপাদান প্রয়োগ করতে হবে, উদাহরণস্বরূপ:

var hoveredItem = !!$('ol>li').filter(function() { return $(this).is(":hover"); });
                  // not .filter(':hover'), as we can't apply :hover on multiple elements

এটি jQuery 1.7 শুরু করে পরীক্ষা করা হয়েছিল।

Answer 17

এখানে একটি ফাংশন রয়েছে যা আপনাকে মৌলটির ভিতরে মাউস রয়েছে কিনা তা যাচাই করতে সহায়তা করে। আপনার কেবলমাত্র সেই ফাংশনটি কল করা উচিত যেখানে আপনি একটি লাইভ মাউস-সম্পর্কিত ইভেন্টওবজেক্ট রাখতে পারেন। এটার মতো কিছু:

$("body").mousemove(function(event){
     element_mouse_is_inside($("#mycontainer", event, true, {});
});

আপনি এখানে গিথুব বা পোস্টের নীচে সোর্স কোড দেখতে পারেন:

https://github.com/mostafatalebi/ElementsLocator/blob/master/elements_locator.jquery.js

function element_mouse_is_inside  (elementToBeChecked, mouseEvent, with_margin, offset_object)
{
    if(!with_margin)
    {
        with_margin = false;
    }
    if(typeof offset_object !== 'object')
    {
        offset_object = {};
    }
    var elm_offset = elementToBeChecked.offset();
    var element_width = elementToBeChecked.width();
    element_width += parseInt(elementToBeChecked.css("padding-left").replace("px", ""));
    element_width += parseInt(elementToBeChecked.css("padding-right").replace("px", ""));
    var element_height = elementToBeChecked.height();
    element_height += parseInt(elementToBeChecked.css("padding-top").replace("px", ""));
    element_height += parseInt(elementToBeChecked.css("padding-bottom").replace("px", ""));
    if( with_margin)
    {
        element_width += parseInt(elementToBeChecked.css("margin-left").replace("px", ""));
        element_width += parseInt(elementToBeChecked.css("margin-right").replace("px", ""));
        element_height += parseInt(elementToBeChecked.css("margin-top").replace("px", ""));
        element_height += parseInt(elementToBeChecked.css("margin-bottom").replace("px", ""));
    }

    elm_offset.rightBorder = elm_offset.left+element_width;
    elm_offset.bottomBorder = elm_offset.top+element_height;

    if(offset_object.hasOwnProperty("top"))
    {
        elm_offset.top += parseInt(offset_object.top);
    }
    if(offset_object.hasOwnProperty("left"))
    {
        elm_offset.left += parseInt(offset_object.left);
    }
    if(offset_object.hasOwnProperty("bottom"))
    {
        elm_offset.bottomBorder += parseInt(offset_object.bottom);
    }
    if(offset_object.hasOwnProperty("right"))
    {
        elm_offset.rightBorder += parseInt(offset_object.right);
    }
    var mouseX = mouseEvent.pageX;
    var mouseY = mouseEvent.pageY;

    if(  (mouseX > elm_offset.left && mouseX < elm_offset.rightBorder)
        && (mouseY > elm_offset.top && mouseY < elm_offset.bottomBorder) )
    {
        return true;
    }
    else
    {
        return false;
    }
}

Answer 18

'হ্যাপিটাইম হ্যারি' কী বলেছে তা প্রসারিত করে, টাইমআউট আইডি সঞ্চয় করার জন্য .data () jquery ফাংশনটি ব্যবহার করতে ভুলবেন না। এটি এমন হয় যাতে 'মাউসেন্টার' পরে একই উপাদানটিতে ট্রিগার করা হলে আপনি খুব সহজেই টাইমআউট আইডিটি পুনরুদ্ধার করতে পারবেন, যাতে আপনার সরঞ্জামদণ্ডটি অদৃশ্য হওয়ার জন্য আপনি ট্রিগারটি মুছে ফেলতে পারবেন।

Answer 19

আপনি jQuery এর মাউসেন্টার এবং মাউসলেভ ইভেন্টগুলি ব্যবহার করতে পারেন। মাউস পছন্দসই জায়গায় প্রবেশ করার পরে আপনি পতাকাটি সেট করতে পারেন এবং অঞ্চলটি ছেড়ে যাওয়ার পরে পতাকাটি আনসেট করতে পারেন।

Comments

এটাই আমি করার কথা ভাবছিলাম। স্ল্যাक्स হিসাবে $ .ডাটা () ব্যবহার করা এটি সম্পাদন করার পক্ষে ভাল উপায় বলে মনে হয়।

— জেমস ব্রাউনআইএসডিয়েড

Answer 20

আমি এই বিষয় থেকে ধারণাগুলি একত্রিত করেছি এবং এটি নিয়ে এসেছি, যা একটি সাবমেনু প্রদর্শন / আড়াল করার জন্য দরকারী:

$("#menu_item_a").mouseenter(function(){
   clearTimeout($(this).data('timeoutId'));
   $("#submenu_a").fadeIn("fast");
}).mouseleave(function(){
   var menu_item = $(this);

   var timeoutId = setTimeout(function(){
      if($('#submenu_a').is(':hover'))
      {
        clearTimeout(menu_item.data('timeoutId'));
      }
      else
      {
        $("#submenu_a").fadeOut("fast");
      }
   }, 650);

    menu_item.data('timeoutId', timeoutId); 
});

 $("#submenu_a").mouseleave(function(){
   $(this).fadeOut("fast");
 });

আমার জন্য কাজ করে বলে মনে হয়। আশা করি এটি কাউকে সাহায্য করবে।

সম্পাদনা: এখন এই পদ্ধতির উপলব্ধি করা IE এ সঠিকভাবে কাজ করছে না।

Answer 21

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

সুতরাং আমি এটি করি:

নং 1. আপনার যখন প্রয়োজন হবে তখন যতবার স্থানান্তরিত হবে মাউস এক্স, ওয়াই অবস্থানটি সংরক্ষণ করুন,
নং 2। মাউসটি কোয়েরির সাথে মেলে এমন কোনও উপাদানগুলির উপর নির্ভর করে কিনা তা পরীক্ষা করুন ... যেমন মাউসেনটার ইভেন্টকে ট্রিগার করুন

// define mouse x, y variables so they are traced all the time
var mx = 0; //  mouse X position
var my = 0; //  mouse Y position

// update mouse x, y coordinates every time user moves the mouse
$(document).mousemove(function(e){
    mx = e.pageX;
    my = e.pageY;
});

// check is mouse is over an element at any time You need (wrap it in function if You need to)
$("#my_element").each(function(){
    boxX = $(this).offset().left;
    boxY = $(this).offset().top;
    boxW = $(this).innerWidth();
    boxH = $(this).innerHeight();
    if ((boxX <= mx) &&
        (boxX + 1000 >= mx) &&
        (boxY <= my) &&
        (boxY + boxH >= my))
    {
        // mouse is over it so you can for example trigger a mouseenter event
        $(this).trigger("mouseenter");
    }
});

Answer 22

উপরের জনপ্রিয় এবং সহায়ক আর্থার স্বর্ণকারের উত্তর সম্পর্কে কেবল একটি নোট: আপনি যদি নিজের মাউসকে আইয়িতে একটি উপাদান থেকে অন্য উপাদানে নিয়ে যাচ্ছেন (কমপক্ষে আইই 9 পর্যন্ত) আপনার যদি নতুন উপাদানটির একটি থাকে তবে সঠিকভাবে এটি কাজ করতে কিছুটা সমস্যা হতে পারে স্বচ্ছ পটভূমি (এটি এটি ডিফল্টরূপে হবে)। আমার কাজটিই হ'ল নতুন উপাদানটিকে স্বচ্ছ পটভূমি চিত্র দেওয়া।

Answer 23

$(document).hover(function(e) {
    alert(e.type === 'mouseenter' ? 'enter' : 'leave');
});

---

বেহালা

Answer 24

আপনি is(':visible');jquery ব্যবহার করতে পারেন এবং $ ('। আইটেম: হোভার') এর জন্য এটি জ্যাকুরিতেও কাজ করছে।

এটি একটি এইচটিএম কোড স্নিপেট:

    <li class="item-109 deeper parent">
<a class="root" href="/Comsopolis/index.php/matiers"><span>Matiers</span></a>
<ul>
<li class="item-110 noAff">
<a class=" item sousMenu" href="/Comsopolis/index.php/matiers/tsdi">
<span>Tsdi</span>
</a>
</li>
<li class="item-111 noAff">
<a class="item" href="/Comsopolis/index.php/matiers/reseaux">
<span>Réseaux</span>
</a>
</li>
</ul>
</li>

এবং এটি জেএস কোড:

$('.menutop > li').hover(function() {//,.menutop li ul

    $(this).find('ul').show('fast');

},function() {
    if($(this).find('ul').is(':hover'))
    $(this).hide('fast');

});

 $('.root + ul').mouseleave(function() {
    if($(this).is(':visible'))
    $(this).hide('fast');

});

এই আমি সম্পর্কে কথা বলছিলাম :)

Comments

জিজ্ঞাসা করা প্রশ্নের সাথে এটি কীভাবে সম্পর্কিত তা আমি দেখছি না।

— অ্যান্ড্রু বারবার

আপনি মাউসওভার থেকে বেরিয়ে এসে আপনার লুকানো উপাদানটি প্রদর্শন করতে পারবেন এবং একটি বিলম্বের পরে আপনি যখন মাউস লক্ষ্য উপাদানটি লুকাতে / প্রদর্শন করতে চান তখন মাউস প্রবেশ করবে কিনা তা পরীক্ষা করতে পারবেন

— ucefkh

আমি মনে করি না আপনি প্রশ্নটি খুব একটা ভালভাবে পড়েছেন। এটি তার যা প্রয়োজন তা মোটেই নয়।

— অ্যান্ড্রু বারবার

কি আপনি করছেন এর সাথে সম্পর্কিত নয় এই প্রশ্নের । (আপাতদৃষ্টিতে (

— অ্যান্ড্রু বার্বার