Utilisation de jQuery : ajout dynamique de petites annonces-js tutoriel-php.cn

Utilisation de jQuery : ajout dynamique de petites annonces

巴扎黑

Libérer： 2017-07-23 15:07:08

original

1287 Les gens l'ont consulté

Lors de la navigation sur des sites Web, certains sites Web placent toujours des publicités dans le coin inférieur droit, le coin supérieur gauche ou à d'autres endroits.

J'ai essayé d'en créer un moi-même en utilisant jQuery. Le code est le suivant. S'il y a quelque chose qui ne va pas, faites-le moi savoir.

 1 <!DOCTYPE html> 2 <html xmlns=""> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 5     <title></title> 6     <script src="jquery-1.8.3.js"></script> 7     <script type="text/javascript"> 8         $(function () { 9             $('#btn').click(function () {10                 //创建层11                 var divObj = $('<div style="width:200px;height:200px;position:absolute;right:0;bottom:0;background-color:orange"></div>').appendTo($('body'));12                 //创建右上角关闭按钮13                 $('<sapn style="float:right;cursor:pointer; border:3px solid gray">X</span>').click(function () {14                     $(this).parent().remove();15                 }).appendTo($(divObj));16                 //添加广告内容17 18             });19         });20     </script>21 </head>22 <body>23     <input type="button" name="name" value="显示效果" id="btn"/>24 </body>25 </html>

Copier après la connexion

Le rendu est. comme suit

Concernant cet effet, j'ai les réflexions suivantes :

1 Vous pouvez ajouter une minuterie, compte à rebours '5S. fermer', et '4S fermer' indique aux utilisateurs que cette publicité n'est placée que temporairement et sera automatiquement fermée après 5 secondes. Cela peut améliorer l'expérience utilisateur. Nous savons tous que lors de la navigation sur certains sites Web, les publicités prennent toujours de la place et se déplacent. sous vos yeux. L'expérience utilisateur n'est certainement pas bonne. Très bonne, cela peut créer un bon équilibre entre les annonceurs et l'expérience utilisateur

2 La raison pour laquelle la couleur de fond est orange est parce que l'orange est un. couleur chaude. Expérience personnelle, si le fond publicitaire est Si la couleur est chaude, je suis plus disposé à le laisser rester un certain temps, par rapport à la publicité avec une couleur de fond froide

3. ce n'est qu'un petit code. Une fois que les maîtres ont terminé le contenu, ils peuvent l'encapsuler et il sera certainement plus pratique.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!