
Strony
środa, 26 kwietnia 2023
style type="text/css">
.container {
position: relative;
}
.image {
display: block;
height: auto;
}
.overlay {
position: absolute;
bottom: 0;
left: 25px; /*skąd ma wysunąć się tło z tekstem*/
right: 0;
background: #322c30; /*kolor tła*/
overflow: hidden;
width: 0;
height: 100%;
transition: .5s ease;
}
.container:hover .overlay {
width: 505px; /*szerokość tła z tekstem*/
}
.text {
white-space: nowrap;
color: #fff; /*kolor czcionki*/
position: absolute;
overflow: hidden;
left:255px; /*pozycja tekstu na tle*/
top:250px; /*wysokość tekstu na tle*/
transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
}


Subskrybuj:
Komentarze do posta (Atom)
Brak komentarzy:
Prześlij komentarz