Webleb - Snippet di Codice -

Apri nell'Editor Video Pubblica il Tuo Codice

Consigliato

2 December 2025

<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Random HTML Ideas Generator App</title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css">
    <style>
        body {
            background-color: #f8f9fa;
            color: #333;
            font-family: Arial, sans-serif;
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
        }

.container {
            max-width: 500px;
            text-align: center;
            padding: 20px;
            border-radius: 10px;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
            background-color: #fff;
        }

h1 {
            color: #007bff;
        }

p {
            font-size: 1.2rem;
            margin-bottom: 20px;
        }

.btn-generate {
            background-color: #28a745;
            color: #fff;
            padding: 10px 20px;
            border: none;
            border-radius: 5px;
            cursor: pointer;
            transition: background-color 0.3s;
        }

.btn-generate:hover {
            background-color: #218838;
        }

.idea {
            font-size: 1.5rem;
            margin-top: 40px;
        }

@keyframes pulse {
            0% {
                transform: scale(1);
            }
            50% {
                transform: scale(1.1);
            }
            100% {
                transform: scale(1);
            }
        }

.animated {
            animation: pulse 2s infinite;
        }
    </style>
</head>
<body>
    <div class="container">
        <h1>Random HTML Ideas Generator App</h1>
        <p>Click the button below to generate a random HTML idea!</p>
        <button class="btn-generate" onclick="generateIdea()">Generate Idea</button>
        <div class="idea" id="idea"></div>
    </div>

function generateIdea() {
            const randomIndex = Math.floor(Math.random() * ideas.length);
            document.getElementById('idea').innerText = ideas[randomIndex];
            document.getElementById('idea').classList.add('animated');
            setTimeout(() => {
                document.getElementById('idea').classList.remove('animated');
            }, 2000);
        }
    </script>

Consigliato

Tu contro 100 Skibidi

Un codice di alqsdeus

digitando sullo schermo

HTML

CSS

JS

Consigliato

Tu contro 100 Skibidi

Un codice di alqsdeus

digitando sullo schermo

HTMLCopy

CSSCopy

JSCopy

HTML

CSS

JS