Раскрыть изображение во время падения на текст [закрыто] ⇐ Html

[Anonymous]

У меня есть код, где изображение должно быть раскрыто при парке над контейнером, но он ничего не делает. Что здесь идет не так?
html: < /p>

Код: Выделить всё

Hover over me to see an image
< /code>
css: < /p>
.hover-container {
position: relative;
display: inline-block;
font-size: 24px;
font-weight: bold;
color: white;
padding: 10px 20px;
background-color: black;
transition: background 0.3s ease;
}

/* The default background */
.hover-container::before {
content: “”;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: black;
z-index: -1;
transition: opacity 0.3s ease;
opacity: 1;
}

/* Show an image background on hover */
.hover-container:hover::before {
background-image: url('https://plus.unsplash.com/premium_photo-1683535508528-9228dcc8fa4c?q=80&w=2071&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D');
background-size: cover;
background-position: center;
opacity: 1;
}

Вы можете найти jsfiddle здесь:
https://jsfiddle.net/s9rozwkd/

Подробнее здесь: https://stackoverflow.com/questions/795 ... ng-on-text