भाषण ऐप

96 kevekıbhack

संपादक में खोलें अपना कोड प्रकाशित करें

अनुशंसित

1 December 2024

कॉल एक्शन बटन होवर प्रभाव

28 November 2024

सिस सोलर

21 June 2024

यिंग यांग टॉगल

HTML

<!DOCTYPE html>

<head>

<title>Speech App</title>

<style>

body {

margin: 0;

padding: 0;

background: #121212;

color: white;

font-family: Arial, sans-serif;

display: flex;

flex-direction: column;

align-items: center;

justify-content: center;

height: 100vh;

}

h1 {

margin-bottom: 20px;

}

textarea {

width: 80%;

height: 120px;

font-size: 1rem;

padding: 10px;

border-radius: 6px;

border: none;

resize: none;

outline: none;

}

button {

margin-top: 15px;

padding: 10px 20px;

font-size: 1rem;

background: #00bcd4;

border: none;

border-radius: 6px;

color: white;

cursor: pointer;

}

button:hover {

background: #0097a7;

}

select {

margin-top: 10px;

padding: 5px;

font-size: 1rem;

border-radius: 6px;

}

</style>

</head>

<body>

<h1>Speech App</h1>

<button onclick="speakText()">Speak</button>

const synth = window.speechSynthesis;

const textArea = document.getElementById('text');

const voiceSelect = document.getElementById('voiceSelect');

let voices = [];

function loadVoices() {

voices = synth.getVoices();

voiceSelect.innerHTML = '';

voices.forEach((voice, i) => {

const option = document.createElement('option');

option.value = i;

option.textContent = `${voice.name} (${voice.lang})`;

voiceSelect.appendChild(option);

});

}

if ('speechSynthesis' in window) {

loadVoices();

synth.onvoiceschanged = loadVoices;

}

function speakText() {

const text = textArea.value;

if (text.trim() === '') return;

const utterance = new SpeechSynthesisUtterance(text);

utterance.voice = voices[voiceSelect.value];

synth.speak(utterance);

}

</script>

</body>

</html>

भाषण ऐप

अनुशंसित

कॉल एक्शन बटन होवर प्रभाव

सिस सोलर

यिंग यांग टॉगल

HTML

CSS

JS

अनुशंसित

कॉल एक्शन बटन होवर प्रभाव

सिस सोलर

यिंग यांग टॉगल

HTMLCopy

CSSCopy

JSCopy

HTML

CSS

JS