DICCIONARIO DE PALABRAS Y PRONUNCIACIÓN

1525 Kyekyeku-tech

Abrir en el editor Publica tu código

Recomendado

24 March 2025

Panel de administración de AdminHub v2.1

29 May 2025

Un código de mathieu.ratro

27 November 2024

Control deslizante de imágenes adaptable

HTML

CSS

body {
            display: flex;
            background-image: url('https://telegra.ph/file/ddf9087dae1e826d8b986.jpg');
            justify-content: center;
            align-items: center;
            height: 100vh;
            background-color: #f0f0f0;
            margin: 0;
            font-family: Arial, sans-serif;
            flex-direction: column;
        }
        .container {
            background: #fff;
            border: 2px solid blue;
            padding: 20px 30px;
            border-radius: 10px;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
            width: 400px;
            text-align: center;
            margin-top: 50px; /* Added margin to account for marquee */
        }
        input {
            width: calc(100% - 22px);
            padding: 10px;
            margin-bottom: 10px;
            border: 1px solid #2009f1;
            border-radius: 5px;
            font-size: 16px;
            box-sizing: border-box;
        }
        button {
            padding: 10px 20px;
            border: none;
            background-color: #007BFF;
            color: white;
            border-radius: 5px;
            font-size: 16px;
            cursor: pointer;
            transition: background-color 0.3s ease;
        }
        button:hover {
            background-color: #00b336;
        }
        .definition {
            text-align: left;
            margin-top: 20px;
        }
        .definition p {
            margin: 0;
            padding: 5px 0;
            border-bottom: 1px solid #160101;
        }
        .marquee-container {
            color: rgb(248, 6, 6);
            height: 10%;
            width: 100%;
            position: fixed;
            top: 0;
            background-color: #0606f5; /* Optional background color for better visibility */
            z-index: 1000;
            padding: 5px 0;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);

JS

function speak() {
            var text = document.getElementById("word").value;
            var utterance = new SpeechSynthesisUtterance(text);
            speechSynthesis.speak(utterance);
        }

async function getDefinition() {
            const word = document.getElementById("word").value;
            const definitionDiv = document.getElementById("definition");
            definitionDiv.innerHTML = ''; // Clear previous definition

if (!word) {
                definitionDiv.innerHTML = '<p>Please enter a word.</p>';
                return;
            }

try {
                const response = await fetch(`https://api.dictionaryapi.dev/api/v2/entries/en/${word}`);
                if (!response.ok) {
                    throw new Error('please provide Dictionary Words Only.         Best Regard: Kyekyeku-Tech');
                }
                const data = await response.json();
                const definitions = data[0].meanings[0].definitions;

definitions.forEach(def => {
                    const p = document.createElement('p');
                    p.textContent = def.definition;
                    definitionDiv.appendChild(p);
                });
            } catch (error) {
                definitionDiv.innerHTML = `<p>${error.message}</p>`;
            }
        };

Recomendado

Panel de administración de AdminHub v2.1

Un código de mathieu.ratro

Control deslizante de imágenes adaptable

HTMLCopy

CSSCopy

JSCopy

HTML

CSS

JS