আইপ্যাড / আইফোনের হোভার সমস্যার কারণে ব্যবহারকারী কোনও লিঙ্কে ডাবল ক্লিক করতে পারেন

Question

আমার বেশ কয়েকটি ওয়েবসাইট আগে তৈরি হয়েছিল, যা jquery মাউস ইভেন্টগুলি ব্যবহার করে ... আমি সবেমাত্র একটি আইপ্যাড পেয়েছি এবং আমি লক্ষ্য করেছি যে ইভেন্টগুলির উপরের সমস্ত মাউস ক্লিকগুলিতে অনুবাদ করা আছে ... সুতরাং উদাহরণস্বরূপ আমাকে একটির পরিবর্তে দুটি ক্লিক করতে হবে .. (প্রথম ক্লিকের তুলনায় আসল ক্লিকের তুলনায়)

এটি সমাধানের জন্য কি কোনও কার্যতালিকা প্রস্তুত? মাউসওভার / আউট ইত্যাদির পরিবর্তে আমি শ্যাডল একটি jquery কমান্ড ব্যবহার করেছি .. ধন্যবাদ!

Comments

আপনার ইভেন্টগুলি কি আবদ্ধ? যেমন অন্লিক ইভেন্টগুলি ঠিকঠাক কাজ করা উচিত ... অনমাউসওভার, অনমাউসআউট এবং সিএসএস: হোভার এমন একটি বিষয় যা হ্যান্ডেল করা কিছুটা কঠিন কারণ কোনও টাচ স্ক্রিনে কোনও "হোভার" উপলব্ধ নেই available আপনার একটি কোড নমুনা আছে?

— স্কানলিফ

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

— JER

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

— অ্যান্ডি অ্যাটকিনসন

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

— হারুন

Answer 1

এটি পুরোপুরি পরীক্ষা করা যায় নি তবে যেহেতু আইওএস স্পর্শ ইভেন্টগুলিতে আগুন জ্বালিয়েছে তাই এটি আপনার কাজকর্মের সেটিং ধরে রেখে ধরে নিতে পারে।

$('a').on('click touchend', function(e) {
    var el = $(this);
    var link = el.attr('href');
    window.location = link;
});

ধারণাটি হ'ল মোবাইল ওয়েবকিট touchendএকটি ট্যাপের শেষে একটি ইভেন্টে আগুন দেয় তাই আমরা তার জন্য শুনি এবং তারপরে touchendকোনও লিঙ্কে কোনও ইভেন্টের গুলি ছোঁড়ার সাথে সাথে ব্রাউজারটি পুনঃনির্দেশিত করা হয় ।

Comments

আমার অনুগ্রহ কোথায়? : পি

— সিডুরুক

ধৈর্য, ​​পদওয়ান। এসও বলেছিলেন যে এটি কার্যকর হতে 24 ঘন্টা সময় নেয়।

— অ্যান্ড্রু হেজেস

JQuery 1.7 হিসাবে, .onপছন্দ করা হয় .live। এই উত্তরটি পড়ার পরে, আমি দেখতে পেলাম যে আমার কোডটি দুর্দান্তভাবে $('a').on('click touchend', function(e) {...})কাজ করে।

— ব্লেজমোনজার

ঠিক আছে, এটি প্রাথমিক সমস্যাটি সমাধান করে তবে একটি নতুন তৈরি করে: যখন স্যুইপ করা হয় তখন ক্লিক করা হয়। এটি কোনও সমাধান নয়।

— luksak

এটির ত্রুটি রয়েছে। আপনি যদি এর সাথে একটি লিঙ্ক ক্লিক target="_blank"করেন তবে একই উইন্ডোতে এবং একটি নতুন উইন্ডোতে খুলবে।

— rybo111

Answer 2

আপনার প্রশ্নটি কী তা সম্পূর্ণরূপে পরিষ্কার নয় তবে মাউসের জন্য হোভার ইফেক্টটি ধরে রেখে আপনি যদি ডাবল ক্লিকটি সরিয়ে দিতে চান তবে আমার পরামর্শটি হ'ল:

• touchstartএবং উপর হোভার ইফেক্ট যুক্ত করুন mouseenter।
• উপর হোভার প্রভাবগুলি সরান mouseleave, touchmoveএবং click।

পটভূমি

কোনও মাউস অনুকরণের জন্য, ওয়েবকিট মোবাইলের মতো ব্রাউজারগুলি যদি কোনও স্পর্শ পর্দায় (আইপ্যাডের মতো) স্পর্শ করে এবং একটি আঙুল ছেড়ে দেয় তবে নিম্নলিখিত ইভেন্টগুলিতে ফায়ার করে (উত্স: html5rocks.com এ টাচ এবং মাউস ):

1. touchstart
2. touchmove
3. touchend
4. 300 মিমি বিলম্ব, যেখানে ব্রাউজার নিশ্চিত করে যে এটি ডাবল ট্যাপ নয়, এটি একটি একক ট্যাপ
5. mouseover
6. mouseenter
   • দ্রষ্টব্য : যদি কোনও mouseover, mouseenterবা mousemoveইভেন্ট পৃষ্ঠার সামগ্রী পরিবর্তন করে, নিম্নলিখিত ইভেন্টগুলি কখনই বরখাস্ত করা হয় না।
7. mousemove
8. mousedown
9. mouseup
10. click

ওয়েব ব্রাউজারকে মাউসের ইভেন্টগুলি এড়িয়ে যেতে বলা সহজভাবে বলে মনে হচ্ছে না।

সবচেয়ে খারাপ কী, যদি কোনও মাউসওভার ইভেন্ট পৃষ্ঠার সামগ্রী পরিবর্তন করে, ক্লিক ইভেন্টটি কখনই বরখাস্ত করা হয় না, যেমন সাফারি ওয়েব সামগ্রী গাইড - হ্যান্ডলিং ইভেন্টস , বিশেষত ওয়ান-ফিঙ্গার ইভেন্টস 6.4 এ চিত্র । "সামগ্রী পরিবর্তন" হুবহু কী, ব্রাউজার এবং সংস্করণে নির্ভর করবে on আমি খুঁজে পেয়েছি যে আইওএস 7.0 এর জন্য, পটভূমির রঙে কোনও পরিবর্তন হয় না (বা আর নেই?)।

সমাধান ব্যাখ্যা

পুনরুদ্ধার করতে:

• touchstartএবং উপর হোভার ইফেক্ট যুক্ত করুন mouseenter।
• উপর হোভার প্রভাবগুলি সরান mouseleave, touchmoveএবং click।

মনে রাখবেন কোনও পদক্ষেপ নেই touchend!

এটি মাউস ইভেন্টগুলির জন্য পরিষ্কারভাবে কাজ করে: mouseenterএবং mouseleave(এর সামান্য উন্নত সংস্করণ mouseoverএবং mouseout) বরখাস্ত করা হয়, এবং হোভার যুক্ত এবং সরিয়ে ফেলুন।

ব্যবহারকারী যদি আসলে click লিঙ্ক থাকে তবে হোভার ইফেক্টটিও সরানো হবে। এটি নিশ্চিত করে যে ব্যবহারকারী যদি ওয়েব ব্রাউজারে পিছনের বোতামটি টিপেন তবে এটি সরানো হবে।

এটি স্পর্শ ইভেন্টগুলির জন্যও কাজ করে: touchstartহোভার ইফেক্টটিতে যুক্ত হয়। এটি '' 'নয়' '' মুছে ফেলা হয়েছে touchend। এটি আবার যুক্ত করা হয় mouseenter, এবং যেহেতু এটি কোনও সামগ্রী পরিবর্তন করে না (এটি ইতিমধ্যে যুক্ত করা হয়েছিল), clickইভেন্টটিও বরখাস্ত করা হয়েছে এবং ব্যবহারকারীকে আবার ক্লিক করার প্রয়োজন ছাড়াই লিঙ্কটি অনুসরণ করা হয়!

ব্রাউজারের একটি touchstartইভেন্টের মধ্যে যে 300 মিমি বিলম্ব হয় এবং clickএটি আসলে ভাল ব্যবহারে রাখা হয় কারণ হোভার এফেক্টটি এই অল্প সময়ের মধ্যে প্রদর্শিত হবে।

যদি ব্যবহারকারী ক্লিকটি বাতিল করার সিদ্ধান্ত নেন, আঙুলের একটি সরানো স্বাভাবিকের মতোই এটি করবে। সাধারণত, এটি কোনও সমস্যা যেহেতু কোনও mouseleaveইভেন্ট বরখাস্ত হয় না, এবং হোভার ইফেক্ট স্থির থাকে। ধন্যবাদ, এটিকে হোভার ইফেক্টটি সরিয়ে সহজেই ঠিক করা যায় touchmove।

এটাই!

মনে রাখবেন যে 300 মিমি বিলম্ব সরিয়ে নেওয়া সম্ভব, উদাহরণস্বরূপ ফাস্টক্লিক লাইব্রেরি ব্যবহার করে তবে এটি এই প্রশ্নের সুযোগের বাইরে।

বিকল্প সমাধান

নিম্নলিখিত বিকল্পগুলির সাথে আমি নিম্নলিখিত সমস্যাগুলি পেয়েছি:

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

আরও পড়া

• http://jsfiddle.net/macfreek/24Z5M/ । এই স্যান্ডবক্সে নিজের জন্য উপরের সমাধানটি পরীক্ষা করুন।
• http://www.macfreek.nl/mmory/ টাচ_আর_মাউস_উইথ_হোভার_এফেক্টস_আইন_এ_উভে_ব্রোজার । এই একই উত্তর, আরও কিছুটা ব্যাকগ্রাউন্ড সহ।
• http://www.html5rocks.com/en/mobile/tou Chandmouse/ । সাধারণভাবে টাচ এবং মাউস সম্পর্কে html5rocks.com এ দুর্দান্ত পটভূমি নিবন্ধ।
• https://developer.apple.com/library/ios/DOCUMENTATION/ অ্যাপল অ্যাপ্লিকেশনস / রেফারেন্স / সাফারিওয়েব কনটেন্ট / হ্যান্ডলিংইভেন্টস / হ্যান্ডলিংএভেন্টস . html । সাফারি ওয়েব সামগ্রী গাইড - হ্যান্ডলিং ইভেন্টগুলি। নির্দিষ্ট চিত্র 6.4 এ দেখুন, যা ব্যাখ্যা করে যে কোনও ঘটনা mouseoverবা mousemoveইভেন্টের সময় কোনও সামগ্রী পরিবর্তনের পরে আর কোনও ইভেন্ট বরখাস্ত করা হয় না ।

আরও দেখুন আইপ্যাড / আইফোন দুবার ক্লিক সমস্যা এবং মোবাইল ব্রাউজারগুলিতে হোভার প্রভাবগুলি অক্ষম করুন ।

Comments

যারা আরও সঠিক সমস্যার সমাধান চান তাদের পক্ষে সেরা ব্যাখ্যা বলে মনে হচ্ছে। থ্যাঙ্কস

— অ্যান্টিপ্লেয়ার

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

— কর্মী

Answer 3

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

এখানে সিএসএস এবং এইচটিএমএল-এর একটি উদাহরণ রয়েছে যা মাউসের উপরে তারকাচিহ্নযুক্ত লেবেলযুক্ত একটি পণ্য ব্লক:

এইচটিএমএল:

<a href="#" class="s"><span class="s-star"></span>Some text here</a>

সিএসএস:

.s {
   background: url(some-image.png) no-repeat 0 0;

}
.s:hover {
   background: url(some-image-r.png) no-repeat 0 0;
}

.s-star {
   background: url(star.png) no-repeat 0 0;
   height: 56px;
   position: absolute;
   width: 72px;
   display:none;
}

.s:hover .s-star {
   display:block;
}

সমাধান (মাধ্যমিক সিএসএস):

/* CSS */
/* Keep hovers the same or hidden */
.s:hover {
   background:inherit;
}
.s:hover .s-star {
   display:none;
}

Comments

আইওএসের

— হেরিমেপল্যাড

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

— ইয়ান এস

Answer 4

Overcomplicated করার প্রয়োজন নেই।

$('a').on('touchend', function() {
    $(this).click();
});

Answer 5

এখানে অন্যরা ইতিমধ্যে যা বলেছে তা আমার পক্ষে কাজ করেছে:

হোভার বা মাউসমেভগুলিতে উপাদানগুলি / লুকিয়ে রাখবেন না (এটি আমার ক্ষেত্রে ঘটনা) is

অ্যাপল যা বলেছে তা এখানে ( https://developer.apple.com/library/content/docamentation/ অ্যাপ্লিকেশন অ্যাপ্লিকেশনস / রেফারেন্স / সাফারিওয়েব কনটেন্ট / হ্যান্ডলিং এভেণ্টস / হ্যান্ডলিংএভেস্টস html ):

একটি ক্লিকযোগ্য উপাদান হ'ল একটি লিঙ্ক, ফর্ম উপাদান, চিত্র মানচিত্রের অঞ্চল বা মাউসমোভ, মাউসডাউন, মাউসআপ বা অনক্লিক হ্যান্ডলারের সাথে অন্য কোনও উপাদান is

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

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

তবে ... আপনি যদি ব্যবহারকারী এজেন্টদের সাথে জগাখিচুড়ি করতে না চান এবং এখনও হোভার / মাউসমেভগুলিতে উপাদানগুলি লুকান / দেখান, আমি জানতে পেরেছিলাম যে আপনি নেটিভ জাভাস্ক্রিপ্ট ব্যবহার করে এটি করতে পারেন:

$("body").on("mouseover", function() {
       document.getElementsByTagName("my-class")[0].style.display = 'block'; //show element
       document.querySelector(".my-selector div").style.display = 'none'; // hide element
});

এটি ডেস্কটপ সংস্করণে কাজ করবে এবং মোবাইল সংস্করণে কিছুই করবে না।

এবং আরও কিছুটা সামঞ্জস্যের জন্য ...

$("body").on("mouseover", function() {
   if (document.getElementsByTagName && document.querySelector) { // check compatibility
       document.getElementsByTagName("my-class")[0].style.display = 'block'; //show element
       document.querySelector(".my-selector div").style.display = 'none'; // hide element
    } else {
        $(".my-class").show();
        $(".my-selector div").hide();
    }
});

Comments

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

— ভুয়া হক

Answer 6

সিডুরুকের সমাধানটি বেশ কার্যকর ছিল, তবে আমার সাইটের কয়েকটি অংশে সমস্যা সৃষ্টি করেছিল। যেহেতু আমি সিএসএস হোভার ক্লাস যুক্ত করতে ইতিমধ্যে jQuery ব্যবহার করছিলাম, সহজ সমাধানটি হ'ল মোবাইল ডিভাইসে সিএসএস হোভার ক্লাসটি যুক্ত করা হয়নি (বা আরও স্পষ্টভাবে, কেবলমাত্র কোনও মোবাইল ডিভাইসে না থাকলে এটি যুক্ত করা)।

এখানে সাধারণ ধারণা ছিল:

var device = navigator.userAgent.toLowerCase();
var ios = device.match(/(iphone|ipod|ipad)/);

if (!(ios)) {
    $(".portfolio-style").hover(
        function(){
            $(this).stop().animate({opacity: 1}, 100);
            $(this).addClass("portfolio-red-text");
        },
        function(){
            $(this).stop().animate({opacity: 0.85}, 100);
            $(this).removeClass("portfolio-red-text");
        }
    );
}

* কোড উদাহরণস্বরূপ উদ্দেশ্যে হ্রাস

Comments

এটি পরিষ্কারভাবে উত্তর। অন্যান্য "সমাধান" সমস্যার সমাধান করে না। আইওএস সাফারি এই ভেবে পরিষ্কারভাবে ত্রুটিযুক্ত যে আমরা প্রথমে হোভার চাই। আপনি যখন কোনও আইটেমের উপর ঘুরে বেড়ান তখন অন্যান্য ওএসের আসল হোভার বৈশিষ্ট্য রয়েছে।

— জোশুয়া প্যাক

এটিই ছিল আমার জন্য একমাত্র কাজ। তোমাকে অনেক ধন্যবাদ!

— tx291

Answer 7

আমি মনে করি mouseenterএর জায়গায় চেষ্টা করা বুদ্ধিমানের কাজ হবে mouseover। বাঁধার সময় অভ্যন্তরীণভাবে এটি কী ব্যবহার করা হয় .hover(fn,fn)এবং সাধারণত আপনি যা চান তা তা।

Answer 8

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

সমস্যাগুলি সমাধান করে

ন্যায়সঙ্গত touchstartবা touchend:

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

ট্রিগারিং mouseoverঘটনা touchstartএবং mouseoutউপর touchmoveকম গুরুতর আছে, কিন্তু স্বাভাবিক ব্রাউজার আচরণ হস্তক্ষেপ করে উদাহরণস্বরূপ:

• একটি দীর্ঘ প্রেস একটি মাউসওভার ট্রিগার করবে যা কখনই শেষ হয় না।
• অনেকগুলি অ্যান্ড্রয়েড ব্রাউজার আঙুলের অবস্থানটির touchstartমতো চিকিত্সা করে mouseoverযা mouseoutপরেরটিতে সম্পাদিত হয় touchstart। অ্যান্ড্রয়েডে মাউসওভার সামগ্রী দেখার একটি উপায় হ'ল আগ্রহের ক্ষেত্রটি স্পর্শ করা এবং আপনার আঙুলটি গুঁড়িয়ে দেওয়া, পৃষ্ঠাটি কিছুটা স্ক্রল করে নেওয়া। touchmoveএটি mouseoutবিরতি হিসাবে চিকিত্সা ।

সমাধান

তত্ত্বের ক্ষেত্রে, আপনি কেবল এটি দিয়ে একটি পতাকা যুক্ত করতে পারেন touchmove, তবে কোনও গতিবিধি না থাকলেও আইফোনগুলি টাচমোভ ট্রিগার করে। তত্ত্ব, আপনি শুধু তুলনা পারে touchstartএবং touchendঘটনা pageXএবং pageY কিন্তু আইফোন উপর, আছে কোন touchend pageXবাpageY ।

দুর্ভাগ্যক্রমে সমস্ত ঘাঁটি কভার করার জন্য এটি কিছুটা জটিল হয়ে যায়।

$el.on('touchstart', function(e){
    $el.data('tstartE', e);
    if(event.originalEvent.targetTouches){
        // store values, not reference, since touch obj will change
        var touch = e.originalEvent.targetTouches[0];
        $el.data('tstartT',{ clientX: touch.clientX, clientY: touch.clientY } );
    }
});
$el.on('touchmove', function(e){
    if(event.originalEvent.targetTouches){
        $el.data('tstartM', event.originalEvent.targetTouches[0]);
    }
});

$el.on('click touchend', function(e){
    var oldE = $el.data('tstartE');
    if( oldE && oldE.timeStamp + 1000 < e.timeStamp ) {
        $el.data('tstartE',false);
        return;
    }
    if( $el.data('iosTouchM') && $el.data('tstartT') ){
        var start = $el.data('tstartT'), end = $el.data('tstartM');
        if( start.clientX != end.clientX || start.clientY != end.clientY ){
            $el.data('tstartT', false);
            $el.data('tstartM', false);
            $el.data('tstartE',false);
            return;
        }
    }
    $el.data('tstartE',false);

তত্ত্ব অনুসারে, একটি অনুমিত হিসাবে 1000 ব্যবহারের পরিবর্তে দীর্ঘতর সময়টির জন্য সঠিক সময়টি ব্যবহারের উপায় রয়েছে তবে বাস্তবে এটি এতটা সহজ নয় এবং যুক্তিসঙ্গত প্রক্সি ব্যবহার করা ভাল ।

Answer 9

ম্যাকফ্রেকের উত্তরটি আমার পক্ষে অত্যন্ত সহায়ক ছিল। এটি আপনাকে সহায়তা করে এমন কিছু হ্যান্ডস-অন কোড এখানে।

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

আমি jQuery এর সাথে একটি প্রভাব তৈরি করছি যা জড়িত বোতামটি "হাইলাইট" করতে কিছু বোতামের নীচে একটি লাইন বিবর্ণ করে। আমি চাই না এর অর্থ এই যে আপনি লিঙ্কটি অনুসরণ করতে স্পর্শ ডিভাইসে দুটি বার বোতাম টিপতে হবে।

বোতামগুলি এখানে:

<a class="menu_button" href="#">
    <div class="menu_underline"></div>
</a>

আমি চাই "মেনু_উন্ডারলাইন" বিভাগটি মাউসওভারে বিবর্ণ হয়ে যায় এবং মাউসআউটটি ম্লান হয়ে যায়। তবে আমি চাই স্পর্শ ডিভাইস দুটি নয়, একক ক্লিকের লিঙ্কটি অনুসরণ করতে সক্ষম হোক।

সমাধান - এটি কার্যকর করার জন্য এখানে jQuery রয়েছে:

//Mouse Enter
$('.menu_button').bind('touchstart mouseenter', function(){
    $(this).find(".menu_underline").fadeIn();
});

//Mouse Out   
$('.menu_button').bind('mouseleave touchmove click', function(){
    $(this).find(".menu_underline").fadeOut();
});

এই ম্যাকফ্রেকে আপনার সহায়তার জন্য অনেক ধন্যবাদ।

Answer 10

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

if(/iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream){
    var elements = document.getElementsByTagName('a');
    for(var i = 0; i < elements.length; i++){
        elements[i].addEventListener('touchend',function(){});
    }
}

Answer 11

আমি "ভাবি" যে আপনার লিঙ্কগুলিতে কোনও অন-মাউসওভার ইভেন্ট নেই, যেখানে 1 টি ট্যাপ অনমઉસওভারকে সক্রিয় করে এবং ডাবল ট্যাপটি লিঙ্কটিকে সক্রিয় করে। তবে আইডিকি আমার আইপ্যাড নেই আমার মনে হয় আপনি ইঙ্গিত / স্পর্শ ইভেন্টগুলি ব্যবহার করবেন।

https://developer.apple.com/documentation/webkitjs

Answer 12

আমার একই সমস্যা ছিল তবে টাচ ডিভাইসে নয়। প্রতিবার ক্লিক করার পরে ইভেন্টটি ট্রিগার করে। ইভেন্ট সারিবদ্ধ বা অন্য কিছু সম্পর্কে আছে।

তবে আমার সমাধানটি এর মতো ছিল: ক্লিক ইভেন্টে (বা স্পর্শ?) আপনি একটি টাইমার সেট করেছেন। যদি লিঙ্কটি আবার এক্স এমএসের মধ্যে ক্লিক করা হয় তবে আপনি কেবল মিথ্যা প্রত্যাবর্তন করুন।

উপাদান টাইমার প্রতি সেট করতে, আপনি ব্যবহার করতে পারেন $.data()।

এটি উপরে বর্ণিত @ ফারডি সমস্যাটিও ঠিক করতে পারে।

Comments

এই কোডটি দেখতে কেমন পোস্ট করতে পারেন? ক্লিক ইভেন্টের এই সমস্যাটি আমার দুবার ট্রিগার হতে চলেছে।

— অভিনব

Answer 13

আপনি যদি মডার্নজার ব্যবহার করেন তবে মডার্নিজারআউটচ ব্যবহার করা খুব সহজ is

তবে, আমি কেবল নিরাপদ থাকার জন্য মডার্নিজারআরটচ এবং ব্যবহারকারী এজেন্ট পরীক্ষার সংমিশ্রণটি ব্যবহার করতে পছন্দ করি।

var deviceAgent = navigator.userAgent.toLowerCase();

var isTouchDevice = Modernizr.touch || 
(deviceAgent.match(/(iphone|ipod|ipad)/) ||
deviceAgent.match(/(android)/)  || 
deviceAgent.match(/(iemobile)/) || 
deviceAgent.match(/iphone/i) || 
deviceAgent.match(/ipad/i) || 
deviceAgent.match(/ipod/i) || 
deviceAgent.match(/blackberry/i) || 
deviceAgent.match(/bada/i));

function Tipsy(element, options) {
    this.$element = $(element);
    this.options = options;
    this.enabled = !isTouchDevice;
    this.fixTitle();
};

আপনি যদি মডার্নজার ব্যবহার না করেন তবে আপনি কেবলমাত্র এটি প্রতিস্থাপন করতে পারেন Modernizr.touch উপরের ফাংশনটি('ontouchstart' in document.documentElement)

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

Answer 14

আপনি ব্যবহার করতে পারেন click touchend,

উদাহরণ:

$('a').on('click touchend', function() {
    var linkToAffect = $(this);
    var linkToAffectHref = linkToAffect.attr('href');
    window.location = linkToAffectHref;
});

উপরে উদাহরণস্বরূপ স্পর্শ ডিভাইসের সমস্ত লিঙ্ক প্রভাবিত করবে।

আপনি যদি কেবলমাত্র নির্দিষ্ট লিঙ্কগুলিকেই টার্গেট করতে চান তবে আপনি তাদের উপর একটি শ্রেণী নির্ধারণ করে এটি করতে পারেন, যেমন:

এইচটিএমএল:

<a href="example.html" class="prevent-extra-click">Prevent extra click on touch device</a>

jQuery:

$('a.prevent-extra-click').on('click touchend', function() {
    var linkToAffect = $(this);
    var linkToAffectHref = linkToAffect.attr('href');
    window.location = linkToAffectHref;
});

চিয়ার্স,

Jeroen

Answer 15

আমি একইরকম পরিস্থিতিতে দৌড়েছি যেখানে আমি ইভেন্টগুলিকে মাউসেন্টার / মাউসলেভ / কোনও উপাদানের ক্লিক স্টেটের সাথে আবদ্ধ করে রেখেছিলাম, তবুও একটি আইফোনে ব্যবহারকারীকে প্রথমে মাউসেন্টার ইভেন্টটি ট্রিগার করতে এলিমেন্টটিতে ডাবল ক্লিক করতে হয়েছিল, তারপরে আবার ক্লিক ইভেন্টটি ফায়ার করতে হবে ।

আমি উপরের মতো অনুরূপ পদ্ধতিটি ব্যবহার করে এটি সমাধান করেছি, তবে আমি jQuery $। ব্রাউজার প্লাগইন (jQuery 1.9> এর জন্য) ব্যবহার করেছি এবং মাউসেন্টার বাইন্ডিং ইভেন্টে একটি। ট্রিগার ইভেন্ট যুক্ত করেছি:

// mouseenter event
$('.element').on( "mouseenter", function() {
    // insert mouseenter events below

    // double click fix for iOS and mouseenter events
    if ($.browser.iphone || $.browser.ipad) $(this).trigger('click');
});
// mouseleave event
$('.element').on( "mouseleave", function() { 
    // insert mouseout events below
});
// onclick event
$('.element').on( "click", function() {
    // insert click events below
});

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

আপনি এখানে jQuery b। ব্রাউজার প্লাগইন পেতে পারেন: https://github.com/gabceb/jquery-browser-plugin

Answer 16

আপনি ভুল করে কোনও লিঙ্কে আঙুল স্লাইড করলে পুনঃনির্দেশ এড়ানোর জন্য কেবল একটি উন্নতি।

// tablet "one touch (click)" X "hover" > link redirection
$('a').on('touchmove touchend', function(e) {

    // if touchmove>touchend, set the data() for this element to true. then leave touchmove & let touchend fail(data=true) redirection
    if (e.type == 'touchmove') {
        $.data(this, "touchmove_cancel_redirection", true );
        return;
    }

    // if it's a simple touchend, data() for this element doesn't exist.
    if (e.type == 'touchend' && !$.data(this, "touchmove_cancel_redirection")) {
        var el = $(this);
        var link = el.attr('href');
        window.location = link;
    }

    // if touchmove>touchend, to be redirected on a future simple touchend for this element
    $.data(this, "touchmove_cancel_redirection", false );
});

Answer 17

ম্যাকফ্রেকের অনুপ্রেরণায়, আমি এমন কিছু সংশ্লেষ করেছি যা আমার পক্ষে কার্যকর।

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

এই কোডটি আইপ্যাডে পরীক্ষা করুন যাতে সিএসএস এবং জেএস হোভার পদ্ধতিটি আলাদাভাবে আচরণ করে (কেবল হোভার ইফেক্টে)। সিএসএস বোতামটিতে অভিনব ক্লিকের সতর্কতা নেই। http://jsfiddle.net/bensontrent/ctgr6stm/

function clicker(id, doStuff) {
  id.on('touchstart', function(e) {
    id.addClass('hover');
  }).on('touchmove', function(e) {
    id.removeClass('hover');
  }).mouseenter(function(e) {
    id.addClass('hover');
  }).mouseleave(function(e) {
    id.removeClass('hover');
  }).click(function(e) {
    id.removeClass('hover');
    //It's clicked. Do Something
    doStuff(id);
  });
}

function doStuff(id) {
  //Do Stuff
  $('#clicked-alert').fadeIn(function() {
    $(this).fadeOut();
  });
}
clicker($('#unique-id'), doStuff);

button {
  display: block;
  margin: 20px;
  padding: 10px;
  -webkit-appearance: none;
  touch-action: manipulation;
}
.hover {
  background: yellow;
}
.btn:active {
  background: red;
}
.cssonly:hover {
  background: yellow;
}
.cssonly:active {
  background: red;
}
#clicked-alert {
  display: none;
}

<button id="unique-id" class="btn">JS Hover for Mobile devices<span id="clicked-alert"> Clicked</span>

</button>
<button class="cssonly">CSS Only Button</button>
<br>This js method prevents hover from sticking on an ipad, and prevents the click registering as two clicks. In CSS, if you have any :hover in your css, change them to .hover For example .some-class:hover to .some-class.hover

Answer 18

স্পর্শ স্ক্রোলিং না ভেঙে লিঙ্কগুলি কাজ করতে, আমি jQuery মোবাইলের "ট্যাপ" ইভেন্টের সাথে এটি সমাধান করেছি:

    $('a').not('nav.navbar a').on("tap", function () {
        var link = $(this).attr('href');
        if (typeof link !== 'undefined') {
            window.location = link;
        }
    });

Answer 19

আমি অনেক দেরি করেছি, আমি জানি তবে এটি আমার মধ্যে পাওয়া সবচেয়ে সহজ কাজের একটি:

    $('body').on('touchstart','*',function(){   //listen to touch
        var jQueryElement=$(this);  
        var element = jQueryElement.get(0); // find tapped HTML element
        if(!element.click){
            var eventObj = document.createEvent('MouseEvents');
            eventObj.initEvent('click',true,true);
            element.dispatchEvent(eventObj);
        }
    });

এটি কেবল লিঙ্কগুলির জন্য নয় (অ্যাঙ্কর ট্যাগগুলি) তবে অন্যান্য উপাদানগুলির জন্যও। আশাকরি এটা সাহায্য করবে.

Answer 20

এই সংক্ষিপ্ত স্নিপেটটি কাজ করছে বলে মনে হচ্ছে। লিঙ্কটি ট্যাপ করা হলে ক্লিক ইভেন্টটি ট্রিগার করুন:

  $('a').on('touchstart', function() {
    $(this).trigger('click');
  });

Answer 21

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

আমি এটি ব্যবহার:

var selector = "label, a, button";
var timer;
var startX;
var startY;
$(document).on("click", selector, function (e) {
    if ($(this).data("touched") === true) {
        e.stopImmediatePropagation();
        return false;
    }
    return;
}).on("touchend", selector, function (e) {
    if (Math.abs(startX - e.originalEvent.changedTouches[0].screenX) > 10 || Math.abs(startY - e.originalEvent.changedTouches[0].screenY) > 10)
        // user action is not a tap
        return;
    var $this = $(this);
    // Visit: http://stackoverflow.com/questions/1694595/can-i-call-jquery-click-to-follow-an-a-link-if-i-havent-bound-an-event-hand/12801548#12801548
    this.click();
    // prevents double click
    $this.data("touched", true);
    if (timer)
        clearTimeout(timer);
    setTimeout(function () {
        $this.data("touched", false);
    }, 400);
    e.stopImmediatePropagation();
    return false;
}).on("touchstart", function (e) {
    startX = e.originalEvent.changedTouches[0].screenX;
    startY = e.originalEvent.changedTouches[0].screenY;
});

Answer 22

আপনি jquery ui ড্রপডাউন যখন এটি আমার জন্য কাজ করে

if (navigator.userAgent.match(/(iPod|iPhone|iPad)/)) {
      $('.ui-autocomplete').off('menufocus hover mouseover');
}

Answer 23

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

Answer 24

আইপ্যাডে ডাবল-ক্লিকের সমাধানের সহজ উপায়টি মিডিয়া ক্যোয়ারিতে হোভার এফেক্টের জন্য আপনার সিএসএস মোড়ানো @media (pointer: fine):

@media (pointer: fine) {
  a span {
    display: none;
  }
  a:hover span {
    display: inline-block;
  }
}

এই মিডিয়া ক্যোয়ারিতে মোড়ানো সিএসএস কেবল ডেস্কটপে প্রয়োগ করবে।

এই সমাধানটির ব্যাখ্যা এখানে https://css-tricks.com/annoying-momot-double-tap-link-issue/

Answer 25

আপনি এটি চেক করতে navigator.userAgentপারেন:

if(!navigator.userAgent.match(/iPhone/i) || !navigator.userAgent.match(/iPad/i)) {
    //bind your mouseovers...
}

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

Mozilla/5.0 (Linux; U; Android 2.0.1; en-us; Droid Build/ESD56) AppleWebKit/530.17 (KHTML, like Gecko) Version/4.0 Mobile Safari/530.17

আইফোন এর স্ট্রিং একই। আপনি যদি কেবল আইফোন, আইপড, আইপ্যাড, অ্যান্ড্রয়েড এবং ব্ল্যাকবেরি জন্য স্ক্রিন করেন তবে আপনি বেশিরভাগ হ্যান্ডহেল্ড পেতে পারেন, তবে সেগুলি সবই নয়।

Comments

আমি মনে করি, আপাতত পাগল না হওয়ার জন্য, সর্বোত্তম কাজটি কেবল একটি স্ক্রিপ্ট হতে পারে যা হোভার ইভেন্টগুলি এড়িয়ে চলে ... তাই আমার মনে হয় প্রথম উত্তরটি ভাল ছিল ... এবং হ্যাঁ আপনি ঠিক বলেছেন ... আমার উচিত অন্যান্য সমস্ত ডিভাইস সম্পর্কে চিন্তা করুন ... আমি Jquery বা কিছু প্লাগইন এই ধরণের সিদ্ধান্ত বৈশিষ্ট্য ছিল চান ..!

— ফ্রান্সেস্কো

wurfl.sourceforge.net এটি আপনার উত্তর হতে পারে। এটি ওয়্যারলেস ডিভাইসের একটি ডাটাবেস। কোনও জিকুয়েরি প্লাগইন যেমন সোজা হবে না তবে আপনি সর্বদা একটি লিখতে পারেন! এছাড়াও টেরা-ওউরফ্লিল.কম রয়েছে যা একটি এক্সএমএল ফাইলের চেয়ে একটি ডেটাবেস ব্যবহার করে। খুব বেশি খনন করেনি তবে সেখানে হোস্ট করা সংস্করণ থাকতে পারে তাই আপনার উরফ্ল ফাইল বা টেরা-ওফর ডাটাবেস আপ টু ডেট রাখার বিষয়ে আপনাকে চিন্তা করতে হবে না।

— জেসনজটসডাউন

আমি কি কিছু মিস করছি বা আইপ্যাডগুলি সনাক্ত করার বিষয়ে নয়, তবে আইপ্যাডগুলিতে নির্দিষ্ট আচরণের বিষয়ে কাজ করার বিষয়ে প্রশ্ন ছিল?

— অ্যান্ড্রু হেজেস :01

ইউ এ স্নিফিং? 90 এর

— দশক

Answer 26

কেবল একটি সিএসএস মিডিয়া ক্যোয়ারী করুন যা ট্যাবলেট এবং মোবাইল ডিভাইসগুলি বাদ দেয় এবং সেখানে হোভার রাখে। এর জন্য আপনার সত্যিই জ্যাকুয়ারি বা জাভাস্ক্রিপ্টের দরকার নেই।

@media screen and (min-device-width:1024px) {
    your-element:hover {
        /* Do whatever here */
    }
}

এবং এটি এইচটিএমএল মাথায় এটি যুক্ত করার বিষয়ে নিশ্চিত হন যে এটি রেজোলিউশন নয়, প্রকৃত পিক্সেল দিয়ে গণনা করছে।

<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no" />