Sie sind nicht angemeldet.

Fare İzi Türk Bayrağı Efekti (CSS & JavaScript)

Dilber

Schüler

  • »Dilber« ist weiblich
  • »Dilber« ist der Autor dieses Themas

Beiträge: 164

Registrierungsdatum: 10. September 2022

Wohnort: FRANCE

  • 1002
  • Nachricht senden

1

Montag, 2. Juni 2025, 01:01

Fare İzi Türk Bayrağı Efekti (CSS & JavaScript)

PHP-Quelltext

 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32

<style>
         {
            margin: 0;
            overflow: hidden;
            background-color: black;
        }
        .flag-trail {
            position: absolute;
            width: 30px;
            height: 20px;
            background: url('https://upload.wikimedia.org/wikipedia/commons/b/b4/Flag_of_Turkey.svg') no-repeat center center;
            background-size: cover;
            pointer-events: none;
            opacity: 1;
            transition: opacity 0.5s ease-out;
        }
    </style>
</head>
<body>
<script>
    document.addEventListener("mousemove", function(e) {
        let flag = document.createElement("div");
        flag.classList.add("flag-trail");
        document.body.appendChild(flag);
        flag.style.left = `${e.pageX - 15}px`;
        flag.style.top = `${e.pageY - 10}px`;
        setTimeout(() => {
            flag.style.opacity = "0";
            setTimeout(() => flag.remove(), 500);
        }, 50);
    });
</script>

Ähnliche Themen