यह निर्धारित करने का सबसे आसान तरीका है कि उपयोगकर्ता मोबाइल डिवाइस पर है

Question

मैं अपनी वेबसाइट पर एक अधिसूचना बार दिखा रहा हूं, और स्पष्ट रूप से, यह मोबाइल डिवाइस पर अच्छा काम नहीं करता है। मैं केवल डेस्कटॉप उपयोगकर्ताओं के लिए बार दिखाना चाहता हूं।

यह निर्धारित करने का सबसे आसान तरीका क्या है कि उपयोगकर्ता डेस्कटॉप पर या मोबाइल पर है या नहीं? हालांकि आप आसानी से काम कर सकता है CSS3 media queries

यहाँ एक उदाहरण है कि iPhone, Android और ब्लैकबेरी की जांच करता है

Answer 1

चेक जावास्क्रिप्ट, jQuery आदि

Answer 2

उपयोगकर्ता एजेंट की जांच, "सबसे आसान" है; आप आसानी से अन्य मोबाइल ब्राउज़र जोड़ सकते हैं।

var is_mobile = !!navigator.userAgent.match(/iphone|android|blackberry/ig) || false; 

Answer 3

के लिए इस http://detectmobilebrowsers.com/

कार्य मैं लगता है कि यह सुविधा पहचान का उपयोग करने के लिए। यह पता लगाने के लिए कि यह टच डिवाइस है या नहीं, Modernizr का उपयोग करें। आप की तरह कर सकते हैं:

var mousedown = 'mousedown'; 

if (Modernizr.touch) { 
    mousedown = 'touchstart'; 
} 

$('.foo').on(mousedown, handleMouseDown); 

और फिर स्क्रीन की चौड़ाई से निपटने के लिए सीएसएस मीडिया के प्रश्नों का उपयोग करें (और यह भी जावास्क्रिप्ट के साथ स्क्रीन चौड़ाई का पता लगाने के लिए आसान है)। इस तरह आप बड़ी स्क्रीन के साथ स्पर्श उपकरणों को सही तरीके से संभाल सकते हैं, या छोटी स्क्रीन वाले गैर-स्पर्श डिवाइस।

Answer 4

यदि आप modernizr का उपयोग करते हैं। तत्व में "नो-टच" कक्षा जोड़ा जाएगा। आप डिफ़ॉल्ट रूप से बार को छुपा सकते हैं और "नो-टच" कक्षा मौजूद होने पर बार दिखाने के लिए एक सीएसएस नियम जोड़ सकते हैं। उदाहरण:

डिफ़ॉल्ट:

.bar{display:none;}

डेस्कटॉप:

.no-touch .bar{display:block;}