क्या प्लेसहोल्डर टेक्स्ट के लिए रंग सेट करने के लिए jQuery के साथ ":: - वेबकिट-इनपुट-प्लेसहोल्डर" का उपयोग करना संभव है?jQuery परिवर्तन प्लेसहोल्डर टेक्स्ट रंग
कुछ इस तरह:
$("input::-webkit-input-placeholder").css({"color" : "#b2cde0"});
आप वास्तव में नहीं जावास्क्रिप्ट के साथ छद्म चयनकर्ताओं संशोधित कर सकते हैं। आपको मौजूदा <style> element को संशोधित करना होगा।
संभव हो तो, एक वर्ग बनाने:
.your-class::-webkit-input-placeholder {
color: #b2cde0
}
और तत्व में जोड़ें:
$('input').addClass('your-class');
मेरा मानना है कि अधिकांश समय jQuery के साथ स्टाइल प्लेसहोल्डर टेक्स्ट का बिंदु गतिशील रंग होगा। – BenRacicot
मैं MaterializeCSS उपयोग कर रहा था; - यह एक बनाने की बात है
यहाँ गतिशील jQuery का उपयोग कर छद्म तत्व शैलियों की स्थापना का एक उदाहरण है: मैं इस परिणाम
$(".input-field").css("color", themeColor);
$(".input-field>.material-icons").css("color", themeColor);
$(".input-field>label").css("color", themeColor);
देखें तरह इनपुट फ़ील्ड के लिए सीएसएस अद्यतन करने के लिए jQuery के लिए प्रयोग किया जाता <style> तत्व, अपनी टेक्स्ट सामग्री को वांछित शैली घोषणाओं में सेट करना, और दस्तावेज़ में इसे जोड़ना।
<!doctype html>
<html>
<head>
<title>Dynamic Pseudo-element Styles</title>
<script src="https://code.jquery.com/jquery-3.2.1.js"></script>
<script>
$(document).ready(function() {
createStyles();
$('#slider-font-size').on('change', createStyles);
function createStyles() {
// remove previous styles
$('#ph-styles').remove();
// create a new <style> element, set its ID
var $style = $('<style>').attr('id', 'ph-styles');
// get the value of the font-size control
var fontSize = parseInt($('#slider-font-size').val(), 10);
// create the style string: it's the text node
// of our <style> element
$style.text(
'::placeholder { ' +
'font-family: "Times New Roman", serif;' +
'font-size: ' + fontSize + 'px;' +
'}');
// append it to the <head> of our document
$style.appendTo('head');
}
});
</script>
</head>
<body>
<form>
<!-- uses the ::placeholder pseudo-element style in modern Chrome/Firefox -->
<input type="text" placeholder="Placeholder text..."><br>
<!-- add a bit of dynamism: set the placeholder font size -->
<input id="slider-font-size" type="range" min="10" max="24">
</form>
</body>
</html>
इस पर एक नज़र डालें:
यहाँ एक सरल एकल पृष्ठ उदाहरण है http://stackoverflow.com/questions/2610497/change-an-inputs-html5-placeholder-color-with -सीएसएस –
इसे देखने में अच्छा लगा: https://stackoverflow.com/a/20886968/1830909 – QMaster