Janela emergente com redes sociais em HTML

kanikase disse:

Es muy sencillo hacerlo, si sabes algo de html css y js, puedes hacerlo a tu gusto.
de todos modos aquí te dejo este enlace.

How To Make a Modal Box With CSS and JavaScript

Learn how to create a Modal Box with CSS and JavaScript.

www.w3schools.com

Clique para expandir...

CaballeroDigital disse:

No sabes de algún código que esté listo sólo de colocar las url de las redes sociales?

Clique para expandir...

Stron disse:

Amigo el link que te paso el compañero basta con que lo modifiques un poco para hacer lo que quieres... Aqui te dejo un ejemplo de como quedaría.

HTML:

<!-- Modal -->
<div id="myModal" class="modal">

  <div class="modal-content">
    <span class="close">&times;</span>
    <!-- Agregar dentro este div el contenido que quieras que salga en el modal ó los enlaces de tus redes sociales. -->
  </div>

</div>

<script>
/* Crear un SetTimeout de 3 segundos o de los segundos que quieras, y agregas un display blok para mostrar el modal oculto cuando pasen los segundos.
*/
setTimeout(function(){ modal.style.display = "block";}, 3000);

var modal = document.getElementById("myModal"),
    span = document.getElementsByClassName("close")[0];

span.onclick = function() {
  modal.style.display = "none";
}

window.onclick = function(event) {
  if (event.target == modal) {
    modal.style.display = "none";
  }
}
</script>

Si usas fontawesome puedes crear los enlaces con iconos de las redes sociales asi:

HTML:

<a target="_blank" id="shared_wsp" href="facebook.com" class="btn btn-success btn-circle btn-lg">
    <i class="fa fa-facebook-f"></i>
</a>

Clique para expandir...