使用jquery实现红绿灯闪烁效果

最新推荐文章于 2023-06-06 10:20:07 发布

原创

最新推荐文章于 2023-06-06 10:20:07 发布 · 1k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#jquery

本文介绍如何利用jQuery创建红绿灯的闪烁效果，通过代码展示具体实现过程。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

使用jquery实现红绿灯闪烁效果

效果图如下
在这里插入图片描述代码：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
    <script src="jquery.js"></script>
    <style type="text/css">

        .blue{
            height: 200px;
            width: 200px;
            background-color: blue;
        }

        .red{
            height: 200px;
            width: 200px;
            background-color: red;
        }

    </style>
</head>
<body>
<div align="center" style="margin-top: 200px">
<div class="blue" ></div><br />

<input type="button" id="close" value="关闭" />
<input type="button" id="open" value="打开" />
</div>
<script type="text/javascript" charset="utf-8">

    //定义定时器
    var interval;

    //打开定时器
    func