2016-08-09 5 views
6

पर सामग्री का चयन झपकी मैं सामग्री डिजाइन में अपनी वेबसाइट बनाने की कोशिश कर रहा हूं, हालांकि मुझे एमडीबी (बूटस्ट्रैप के लिए सामग्री डिजाइन) या सीटी फ्रेमवर्क को मटेरियल बनाने के बावजूद सामग्री चयन के साथ एक मुद्दा मिला। दोनों विंडोज़/ओएसएक्स/एंड्रॉइड पर ठीक काम कर रहे हैं, हालांकि किसी कारण से जब मैं अपने आईपैड पर Material Select component खोलता हूं और उस पर क्लिक करता हूं, तो ड्रॉपडाउन की पृष्ठभूमि से दिखाया गया एक चमकदार कर्सर होता है।आईओएस

enter image description here

उत्तर

7

प्रयास करें निम्नलिखित कोड:

input.select-dropdown { 
    -webkit-user-select:none; 
    -moz-user-select:none; 
    -ms-user-select:none; 
    -o-user-select:none; 
    user-select:none; 
} 
1

मैं iOS उपकरणों पर एक ही मुद्दा था, मैं materialisecss से "http://materializecss.com/forms.html" का चयन लटकती उपयोग कर रहा हूँ। ब्लिंकिंग कर्सर समस्या को ठीक करने के लिए, मैंने नीचे दिए गए लिंक से संदर्भ कोड का उपयोग किया और उस कोड को थोड़ा संशोधित किया। ।

रेफरी लिंक: https://github.com/Dogfalo/materialize/issues/901

jQuery('select').material_select(); 
/*--- Materialize Select dropdown blinking cursor fix for iOS devices ---*/ 
jQuery('select').siblings('input.select-dropdown').on('mousedown', function(e) { 
    if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) { 
     if (e.clientX >= e.target.clientWidth || e.clientY >= e.target.clientHeight) { 
      e.preventDefault(); 
     } 
    } 
}); 

jQuery ('चुनें') (द्वारा जांच टिप्पणी "ची-bd पर 17 नवंबर 2015 टिप्पणी की,") material_select(); भौतिक बनाने का चयन करने के लिए चयन करें और बाकी कोड ठीक है।

समस्या सिर्फ था यह इतना जोड़ा मोबाइल का पता लगाने हालत डेस्कटॉप दृश्य पर समस्या दे रहा था

if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) { 

नोट: तैयार $ (document) .ready (समारोह दस्तावेज़ में यह कोड जोड़ें() {.. ।});

यह है। मुझे उम्मीद है कि यह आपकी समस्या को हल करेगा। सम्मान, और आपका दिन अच्छा है :)

-1

क्षमा करें, उपर्युक्त कोड काम करता है लेकिन फिर यह ड्रॉप-डाउन के लिए स्क्रॉलिंग को रोकता है।

अभी के लिए मैं नीचे ठीक से उपयोग कर रहा हूं, लेकिन यह पहले चमकते कर्सर को दिखाता है और फिर यह इसे छुपाता है। लेकिन अभी भी यह सही समाधान नहीं है, अगर कोई बेहतर समाधान है यहां पोस्ट करें :)

function checkDropDown(obj){ 
var nextObj = jQuery(obj).next(); 
setTimeout(function(){  
    if (jQuery(nextObj).is(":visible")){ 
     jQuery("input.select-dropdown").css({ 
      "transition" : "none", 
      "left"   : "-999999px" 
     }); 
    }else{ 
     jQuery("input.select-dropdown").css({ 
      "left"   : 0 
     }); 
    } 
}, 250); 
jQuery(document).ready(function(){ 
    jQuery("input.select-dropdown").on("focus", function(){ 
     checkDropDown(jQuery(this)); 
    }); 
    jQuery("input.select-dropdown").on("blur", function(){ 
     checkDropDown(jQuery(this)); 
    }); 
});