Ejemplo de efecto de ventana publicitaria en la esquina inferior derecha seguida en jQuery

Este ejemplo muestra cómo se puede implementar un efecto de ventana publicitaria que sigue en la esquina inferior derecha utilizando jQuery. Compartimos esto con todos para referencia. Aquí está la información específica:

!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title></title>
  <style type="text/css">
    body{margin:0px;font-size:12px;}
    #message
    {
      width:100px;
      height:100px;
      position:fixed;
      background-color:gold;
      right:0px;
      bottom:0px;
      display:none;
    }
  </style>
  <script src="../js/jquery-1.5.1.min.js" type="text/javascript"></script>
  <script type="text/javascript">
    $(function () {
      //Tenga en cuenta que slideDown es expandir, slideUp es ocultar
      $("#message").slideDown(2000, function () {
        //$(this).slideUp(5000);   //gastar5segundos para ocultar
        setTimeout("$('#message').slideUp(5000);",2000)   //Espere dos segundos con un temporizador para ocultar, note que aquí no se puede usar $(this), debe usar el ID
      });
    });
  </script>
</head>
<body>
  <div id="message">
    Soy un anuncio, lo siento!
  </div>
</body>
</html>

Los lectores interesados en más contenido relacionado con jQuery pueden ver la sección especial de este sitio: 'Resumen de técnicas de extensión de jQuery', 'Resumen de plugins y usos comunes de jQuery', 'Resumen de efectos de arrastrar y soltar de jQuery', 'Resumen de técnicas de manipulación de tablas (table) de jQuery', 'Resumen de usos de Ajax en jQuery', 'Resumen de efectos clásicos comunes de jQuery', 'Resumen de técnicas de animación y efectos de jQuery' y 'Resumen de técnicas de selectores de jQuery'.

Espero que lo descrito en este artículo pueda ayudar a todos en el diseño de programas jQuery.

Declaración: El contenido de este artículo se ha obtenido de la red, es propiedad del autor original, el contenido se ha contribuido y subido por los usuarios de Internet, este sitio no posee los derechos de propiedad, no se ha realizado un procesamiento editorial manual y no asume responsabilidades legales relacionadas. Si encuentra contenido sospechoso de infracción de derechos de autor, por favor envíe un correo electrónico a: notice#oldtoolbag.com (al enviar un correo electrónico, reemplaza # con @ para denunciar y proporciona evidencia relevante. Una vez verificada, este sitio eliminará inmediatamente el contenido sospechoso de infracción de derechos de autor.)

Tutoriales básicos

Te gustará