เหลือเปลื่ยน background ทำไม่เป็นอะ (Copy 11673) (Copy 11698)

เหลือเปลื่ยน background ทำไม่เป็นอะ (Copy 11673) (..

✨ PHURI SIRIPOOL

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link href='https://unpkg.com/boxicons@2.1.1/css/boxicons.min.css' rel='stylesheet'>
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css"
        integrity="sha384-UHRtZLI+pbxtHCWp1t77Bi1L4ZtiqrqD80Kn4Z8NTSRyMA2Fd33n5dQ8lWUE00s/" crossorigin="anonymous">
    <style>
        body {
            background: hsl(310, 60%, 85%);
            height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
            overflow: hidden;
        }

.slider {
            position: relative;
            width: 200px;
            height: 200px;
            transform-style: preserve-3d;
            animation: rotate 30s linear infinite;
        }

@keyframes rotate {
            from {
                transform: perspective(1000px) rotateY(0deg);
            }

to {
                transform: perspective(1000px) rotateY(360deg);
            }
        }
        .img {
            position: absolute;
            width: 100%;
            height: 100%;
            background-position: center;
            background-size: cover;
            transform-origin: center;
            transform-style: preserve-3d;
          	border-radius: 50px;
          	transform: rotateY(calc(var(--i) * 45deg)) translateZ(350px);
            transition: all 1s;
        }
        .img1 {
            background-image: url("https://cdn.discordapp.com/attachments/932854342938157106/938445476523552769/523227_164618500342131_136883817_n.jpg");
        }

.img1:hover {
            background-image: url("https://cdn.discordapp.com/attachments/874231369268613120/938686983558017034/FB_IMG_1643870802822.jpg");
        }
    </style>
</head>

</script>
</body>

</html>