Home

<!DOCTYPE html>

<html lang="es">

<cabeza>

<meta charset="UTF-8">

<title>Nube de Etiquetas Ideológicas</title>

<estilo>

cuerpo {

familia de fuentes: Arial, sans-serif;

relleno: 20px;

}

.nube de etiquetas {

pantalla: flex;

envoltura flexible: envolver;

espacio: 10px;

}

.etiqueta {

relleno: 5px 10px;

radio del borde: 5px;

color: blanco;

cursor: puntero;

transición: transformar 0,2s;

}

.etiqueta:hover {

transformar: escala(1.2);

}

</estilo>

</cabeza>

<cuerpo>

<h2>Nube de etiquetas ideológicas</h2>

<div class="nube de etiquetas" id="nube de etiquetas"></div>

<guión>

etiquetas constantes = [

{ texto: "Maoísmo", peso: 5 },

{ texto: "Sindicalismo", peso: 4 },

{ texto: "Comunidad", peso: 5 },

{ texto: "Resistencia Civil", peso: 5 },

{ texto: “Pies Descalzos”, peso: 4 },

{ texto: "Colombia", peso: 3 },

{ texto: "Paneles Cívicos", peso: 2 },

{ texto: "Internacionalismo Obrero", peso: 4 },

{ texto: "Francisco Mosquera", peso: 5 },

{ texto: "Tribuna Roja", peso: 5 },

{ texto: "Frente por la Unidad del Pueblo - FUP", peso: 4 },

{ texto: "Protestas", peso: 3 }

{ texto: "MOIR Legado Mosquera", peso: 5 }

{ texto: "Electorales Colombia", peso: 3 }

{ texto: "Nueva Democracia", peso: 5 }

{ texto: "Socialismo", peso: 5 }

{ texto: "Comunismo", peso: 5 }

{ texto: "Comunas Populares", peso: 5 }

{ texto: "Hua Kuo Feng", peso: 5 }

{ texto: "Reformismo", peso: 4 }

{ texto: "Oportunismo", peso: 4 }

{ texto: "Revisionismo", peso: 5 }

{ texto: "Práctica Social", peso: 5 }

{ texto: "Práctica Histórica", peso: 5 }

{ texto: "Frente Único", peso: 5 }

{ texto: "MOIR Legado Mosquera", peso: 5 }

{ texto: "MOIR", peso: 5 }

{ texto: "marxismo", peso: 5 }

{ texto: "Leninismo", peso: 5 }

{ texto: "estalinismo", peso: 5 }

{ texto: "Dialéctica Materailista", peso: 5 }

{ texto: "Dialéctica Histórica", peso: 5 }

{ texto: “Pekin Informa ", peso: 4 }

{ texto: "Tesis Abril", peso: 5 }

{ texto: "Tesis Yenan", peso: 5 }

{ texto: "Gran Marcha", peso: 5 }

{ texto: "Sábados Comunistas", peso: 5 }

{ texto: "Dazibao", peso: 5 }

{ texto: "Dafong", peso: 5 }

{ texto: "Dabialum", peso: 5 }

{ texto: "Daming", peso: 5 }

{ texto: "Federico Engels", peso: 5 }

{ texto: "El Capital", peso: 5 }

{ texto: "Plusvalía", peso: 5 }

{ texto: "Modo de Producción", peso: 5 }

{ texto: "Comunidad Primitiva", peso: 5 }

{ texto: "Esclavismo", peso: 5 }

{ texto: "Capitalismo", peso: 5 }

{ texto: "Espartaco", peso: 4

{ texto: "Tomás Muntzer", peso: 4 }

{ texto: "Comuna de París", peso: 5 }

{ texto: "Unión soviética", peso: 5 }

{ texto: "URSS", peso: 5 }

{ texto: "Aviones Quinquenales", peso: 5 }

{ texto: "Emulación", peso: 3 }

{ texto: "Jornada de Trabajo", peso: 3 }

{ texto: "Línea Internacional Comunista", peso: 5 }

{ texto: “Carta de los 25 Puntos”, peso: 5

{ texto: "Soberanía, Autonomia, Autodeterminación", peso: 5 }", peso: 5 }

{ texto: "Movimiento Obrero", peso: 5 }

{ texto: "Movimiento Campesino", peso: 5 }

{ texto: "Movimiento Jóvenes", peso: 5 }

{ texto: "Movimiento Mujeres", peso: 5 }

{ texto: "Burguesia Nacional", peso: 5 }

{ texto: "Imperialismo", peso: 5 }

{ texto: "Colonialismo", peso: 5 }

{ texto: "Neocolonialismo", peso: 5 }

{ texto: "Campo Socialista", peso: 4 }

{ texto: "Fuerzas Productivas", peso: 4 }

{ texto: "Ideología", peso: 4 }

{ texto: "Correlación Fuerzas", peso: 5 }

];

const colores = ["#e74c3c", "#3498db", "#2ecc71", "#9b59b6", "#f39c12"];

const contenedor = document.getElementById("tagCloud");

etiquetas.forEach(etiqueta => {

constante span = document.createElement("span");

span.className = "etiqueta";

span.textContent = etiqueta.texto;

span.style.fontSize = `${etiqueta.peso * 6 + 10}px`;

span.style.backgroundColor = colores[Math.floor(Math.random() * colores.length)];

span.onclick = () => alert(`Tiene seleccionado: ${etiqueta.texto}`);

contenedor.appendChild(span);

});

</script>

</cuerpo>

</html>