When I hit enter in my search bar, a new div is created each time. However, I am struggling to assign a background image to the created div as I keep receiving a 404 error in the console. Below is the code snippet I'm working with:
function appendToDom(poster) {
var aPoster = $('<div>');
aPoster.css({
display: 'inline block',
float: 'left',
margin: '10px',
marginLeft: '37px',
marginTop: '20px',
width: '200px',
height: '300px',
fontSize: '36px',
color: 'black'
//backgroundImage: '../services/images/1425663956-outline.png'
})
$(aPoster).css("background-image", "url(~/desktop/MyMovies/public/js/images/1425663956-outline.png)");
$(main).append(aPoster);
I have tried different file locations and paths for my images without success. My end goal is to set the background image of each div using the API-provided image and fallback to the default one if no image is available from the API.
I am currently working in Node environment for this project.