23、JQuery案例（显示/隐藏图片）

最新推荐文章于 2021-10-25 20:02:21 发布

l0510402015

最新推荐文章于 2021-10-25 20:02:21 发布

阅读量504

点赞数 2

分类专栏： 12_JQuery

本文链接：https://blog.csdn.net/l0510402015/article/details/106105012

版权

给定一个div模块，模块的功能是展示一幅图片。

广告显示和隐藏 ---
    注意：如果直接使用CSS的display属性，可以显示/隐藏，但是很生硬，所以使用jQuery的显示隐藏功能

    需求：
        1. 当页面加载完，3秒后。自动显示广告
        2. 广告显示5秒后，自动消失。

    分析：
        1. 使用定时器来完成。setTimeout (执行一次定时器)
        2. 分析发现JQuery的显示和隐藏动画效果其实就是控制display
        3. 使用  show/hide方法来完成广告的显示

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>广告的自动显示与隐藏</title>
    <style>
        #content{width:100%;height:500px;background:#999}
    </style>

    <!--引入jquery-->
    <script type="text/javascript" src="../js/jquery-3.3.1.min.js"></script>
    <script>
        $(function () {
            window.setTimeout(adShow , 3000);//记得传入参数是方法时不要写()

            s

最低0.47元/天解锁文章

l0510402015

关注

2
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
23、JQuery案例（显示/隐藏图片）

给定一个div模块，模块的功能是展示一幅图片。1、定时3秒后将图片显示出来。2、图片显示突然后再过5秒后再将图片隐藏。3、上述功能采用JQuery的功能进行实现。<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>广告的自动显示与隐藏</title> <style> #content{width:10
复制链接

扫一扫