Código HTML ventana emergente con redes sociales

CaballeroDigital

VIP
Épsilon
Redactor
Verificación en dos pasos desactivada
Verificado por Whatsapp
Usuario nuevo
Desde
11 Jun 2020
Mensajes
856
Edad
23
Saludos compañeros. ¿Quién me puede sacar de este aprieto? Ando en busca de un código html que me solvente o tenga la siguiente función:

Quiero que al ingresar a la web, luego de unos 30 segundos aparezca esa ventana emergente con los botones de las redes sociales para seguir: Instagram, Facebook, Twitter y canal de Telegram. Que contenga la opción obviamente de cerrar la ventana.
 

Stron

VIP
Dseda
Diseñador
Verificación en dos pasos activada
Verificado por Whatsapp
Desde
11 Oct 2015
Mensajes
1.197
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>
 

Arriba