Haga clic en "Editar" en el panel a la derecha para remplazar esto con su propio código HTML
Chat Radio Profesional
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
background: #f4f4f4;
}
header {
background: #333;
color: #fff;
padding: 10px 0;
text-align: center;
}
.radio-player {
position: fixed;
top: 0;
left: 0;
width: 100%;
background: #000;
color: #fff;
z-index: 1000;
}
.chat-box {
margin: 50px auto;
padding: 10px;
max-width: 500px;
background: #fff;
border-radius: 8px;
box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
}
#messages {
height: 300px;
overflow-y: auto;
margin-bottom: 10px;
border: 1px solid #ccc;
padding: 5px;
}
input {
width: 70%;
padding: 10px;
margin-right: 5px;
}
button {
padding: 10px 20px;
background: #007BFF;
color: #fff;
border: none;
cursor: pointer;
}
button:hover {
background: #0056b3;
}
const socket = io();
document.getElementById('sendButton').addEventListener('click', () => {
const message = document.getElementById('messageInput').value;
if (message.trim() !== "") {
socket.emit('chat message', message);
document.getElementById('messageInput').value = '';
}
});
socket.on('chat message', (msg) => {
const messageDiv = document.createElement('div');
messageDiv.textContent = msg;
document.getElementById('messages').appendChild(messageDiv);
});
Haga clic en "Editar" en el panel a la derecha para remplazar esto con su propio código HTML
Chat Radio Profesional