Click here for free DL of the app version that can save data.

No:42191

←

Prev Next

→

Filtrar una lista
Developer User18814｜Date and time 24/2/11 0:47:07
Build time 8.521 sec｜Game capacity 2.338KB｜

Script

Filtrar una lista - Juego

Encuentra los pictogramas ocultos

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋Kindle本ランキング

Click here for free DL of the app version that can save data.

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Filtrar una lista - Juego</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            text-align: center;
        }
        
        .search {
            padding: 10px;
            margin-bottom: 10px;
        }
        
        .pictograms-container {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
        }
        
        .pictogram {
            width: 100px;
            height: 100px;
            background-color: lightblue;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 10px;
            cursor: pointer;
        }
        
        .pictogram img {
            max-width: 80%;
            max-height: 80%;
        }
    </style>
</head>
<body>
    <h1>Filtrar una lista - Juego</h1>
    <h3>Encuentra los pictogramas ocultos</h3>
    <input id="search-input" type="text" class="search" placeholder="Busca un pictograma...">
    <div class="pictograms-container">
        <div class="pictogram" onclick="checkItem('perro')"><img src="pictograms/perro.jpg" alt="Perro"></div>
        <div class="pictogram" onclick="checkItem('gato')"><img src="pictograms/gato.jpg" alt="Gato"></div>
        <div class="pictogram" onclick="checkItem('árbol')"><img src="pictograms/arbol.jpg" alt="Árbol"></div>
        <div class="pictogram" onclick="checkItem('sol')"><img src="pictograms/sol.jpg" alt="Sol"></div>
        <div class="pictogram" onclick="checkItem('flor')"><img src="pictograms/flor.jpg" alt="Flor"></div>
        <div class="pictogram" onclick="checkItem('avión')"><img src="pictograms/avion.jpg" alt="Avión"></div>
    </div>
    
    <script>
        const pictogramElements = document.querySelectorAll('.pictogram');
        const searchInput = document.querySelector('#search-input');
        
        function checkItem(item) {
            const searchTerm = searchInput.value.toLowerCase();
            
            if (searchTerm === item.toLowerCase()) {
                alert('¡Encontraste el pictograma correcto!')
            } else {
                alert('¡No es el pictograma correcto! Sigue buscando.');
            }
        }
    </script>
</body>
</html>