I encountered a small issue while working on my project. I was designing a form in HTML using JavaScript, and for the input fields, I decided to use a background image with padding on the left to enhance its appearance. Everything seemed fine until I ran into a problem with a function I created:
function check_email(email) {
var value = email.value;
if (value.length != 0){
if (value.indexOf('@') >= 1) {
if (value.indexOf('.') > (value.indexOf('@') + 1)) {
if (value.length > (valor.lastIndexOf('.') + 1)) {
email.style.background = "#1abc9c";
email.style.color = "#fefefe";
return true;
}
}
}
}
email.style.background = "#ff0000";
email.style.color = "#fefefe";
return false;
}
Whenever the email input field is empty or entered incorrectly, it's replacing my background image with a solid color, causing the image to disappear. Is there a way to change the original image to another one I have created without changing the background to a color?
I apologize for any language mistakes in my explanation. To better illustrate my point, here are some images:
https://i.sstatic.net/9VWKj.jpg - The first image shows the error, the second one displays the current situation, and the final image depicts what I am aiming to achieve.