I have a input text with a transparent background and what I want to do is change its background when I position myself in it, something like the image but with JQuery or JS 
I have a input text with a transparent background and what I want to do is change its background when I position myself in it, something like the image but with JQuery or JS
You can do it with CSS without using Javascript as I show below:
Input:Focus {
Background-color: yellow;
}
I hope this is what you are looking for
In this case we use jquery when activating the event focus that the element is changed the property background and when activating the event blur that returns to its previous status.
$(".input").focus(function(){
$(this).css({"background":"rgb(82, 179, 126)"})
})
$(".input").blur(function(){
$(this).css({"background":"transparent"})
})<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input placeholder="background con jquery" class="input" type="text" name="" value=""> In this case you only have to use the property of css :focus that is activated when the input is active
input:focus {
background: rgb(168, 168, 168);
}<input placeholder="input cambio de color" type="text" name="" value="">You can do it with JavaScript with styles:
function Color(ele){
if ($(ele).val() === "") {
$(ele).css("background-color", "");
}
else{
$(ele).css("background-color", "pink");
}
}<body>
<input type="text" id="ejemplo" name="ejemplo" onchange="Color(this)"/>
</body>