jQuery 自动淡入下一个 html 元素然后循环重新启动

2024-04-03

I have:

<a id="item<?php echo $i; ?>">...</a>
<a id="item<?php echo $i; ?>">...</a>
...

其中 $i 是从 1 开始的当前迭代的值,并将呈现如下内容:

<a id="item1">...</a>
<a id="item2">...</a>
...

我需要的是一个脚本,仅使第一个元素保持可见,然后在几秒钟(假设 4-5)后淡出并淡入下一个元素。并重复这个循环直到最后一个元素。 然后循环重新开始。

不需要“暂停”或下一个/上一个元素。

先感谢您!


你可以使用这个JS:(http://jsfiddle.net/KWmgf/ http://jsfiddle.net/KWmgf/ )

var fadeLoop = function($el) {
    $el.fadeOut(4000, function() {
        var $next = $el.next();
        if ($next.length == 0) {
            $next = $el.siblings(":first");
        }
        $next.fadeIn(4000, function() {
            fadeLoop($next);
        });
    });
};

$(document).ready(function(){
    $("#item1").siblings().hide();
    fadeLoop($("#item1"));
});
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

jQuery 自动淡入下一个 html 元素然后循环重新启动 的相关文章

随机推荐

  • 带 json 参数的 Curl GET 请求

    我正在尝试通过 cURL 从命令提示符向远程 REST API 发送 GET 请求 如下所示 curl X GET H Content type application json H Accept application json http
  • Flutter 如何将数据列表保存到本地存储

    我正在 flutter 上开发电影发现应用程序 我需要将正在播放的电影列表保存在本地存储上以供离线使用 那么我该怎么做 Future gt getNowPlayingMovies 异步 最终字符串现在正在播放 https api themo
  • 如何动态判断Objective-C属性类型?

    我正在尝试动态确定 Objective C 中属性的类型 根据我在本网站和其他地方读到的内容 我相信我正在做正确的事情 但是 我的代码不起作用 下面的代码片段演示了这个问题 尝试获取 backgroundColor 和 frame 的属性信
  • 使用 API 发布不包含图片、标题或元描述的链接 PHP

    使用 API 发帖时 我收到以下消息 https www facebook com weather warnings posts 329128793830700 https www facebook com weather warnings
  • EntityManager.createQuery() 抛出 NullPointerException

    每次都会遇到 NullPointerExceptionEntityManager createQuery or EntityManager createNamedQuery 叫做 我正在使用 Glassfish 4 0 Hibernate
  • 删除SQL Server中删除SQL文档后的弹出消息

    Goal 在 SQL Server 中移除 删除 SQL 文档时不显示弹出窗口 Problem 在我下载最新版本的 SQL Server 之前 当我删除 SQL 文档时 它没有显示任何有关状态的弹出窗口 当我下载最新版本的 SQL Serv
  • Django DateField 默认选项

    我有一个具有日期时间字段的模型 date models DateField Date default datetime now 当我在内置的 django admin 中检查应用程序时 DateField还附加了时间 因此如果您尝试保存它
  • 如何将联系人添加到 ActiveCampaign API v3 中的列表

    根据v3docs https developers activecampaign com v3 reference lists我应该能够使用联系人 API 将联系人添加到列表中 但我不知道如何执行此操作 因为我在下面看不到任何相关列表Con
  • 如何选择 PrimeFaces TreeTable 中的所有内容?

    我有一个 PrimeFaces 树表 想添加一个复选框 允许用户选择 取消选择全部 这是我的 xhtml 的摘录
  • LibGDX 路径 (CatmullRomSpline) 恒速

    我试图使用 LibGDX CatmullRomSpline 在路径上实现恒定速度 但在使其正常工作时遇到问题 我已经尝试对这个主题进行了很多研究 包括阅读 LibGDX wiki 但他们对实现恒定速度的解释并没有真正意义 我无法让他们的方法
  • 如何获取已安装的 OLE DB 提供程序的列表?

    Microsoft Excel 允许从 其他来源 导入数据 其中一种选择是使用 OLE DB 提供程序 如何获取可用 OLE DB 提供程序的列表 如果您有可用的 powershell 只需将其粘贴到 powershell 命令提示符中 f
  • 这是如何使用 CloudConfigurationManager 设置上下文连接字符串?

    我希望使用 CloudConfigurationManager 以便可以利用 Azure 配置文件 我想使用连接字符串 我在 Cloud cscfg 中添加了一个字符串来配置实体框架上下文 我像这样配置我的上下文 public Domain
  • SOFT_INPUT_ADJUST_RESIZE 从 android 30 开始已弃用

    I used SOFT INPUT ADJUST RESIZE为了在键盘弹出时显示所有内容 根据文档 我添加了新的代码片段 if Build VERSION SDK INT gt Build VERSION CODES R requireA
  • UnsatisfiableError:发现以下规范彼此不兼容:

    我在 Ubuntu 16 04 上运行 并且遇到了 Anaconda 问题 由于软件包不一致 我无法再安装 更新或删除软件包 conda info NVIDIA no NVIDIA devices found active environm
  • 如何在签到前获取 place_id ?

    我的应用程序允许用户使用纬度 经度和地名登录 Facebook 但我不知道如何处理 place 参数 有什么方法可以获取或创建一个吗 每个可签到的地点都必须有一个有效的地点 Facebook 页面 The place参数取入page id地
  • admob广告不显示

    我制作了一个简单的应用程序 并在其中添加了一个广告 但它没有显示在设备中 我的代码中没有错误 xml页面
  • Dockerfile 构建引发不够范围:公共 openjdk 映像授权失败

    我正在尝试使用以下命令运行以下 Dockerfile docker compose up remove orphans force recreate build d Dockerfile FROM maven 3 6 3 jdk 11 as
  • Java中如何查找CPU密集型类?

    我有一个使用多线程的 Java 大型程序 在某些情况下 程序开始使用我的八核系统中的三个核心的 100 在正常使用中 程序以 1 2 的速度使用所有核心 如何找到重载核心的类 使用分析器 例如与 jdk 1 6 0 10 捆绑的 jvisu
  • BIO中的B代表什么?

    OpenSSL 使用称为 I O 抽象BIO http www openssl org docs crypto bio html 但我在文档中找不到任何地方说明 B 代表什么 IO 显然是输入 输出 各种网站表明 B 代表basic or
  • jQuery 自动淡入下一个 html 元素然后循环重新启动

    I have a a a a 其中 i 是从 1 开始的当前迭代的值 并将呈现如下内容 a a a a 我需要的是一个脚本 仅使第一个元素保持可见 然后在几秒钟 假设 4 5 后淡出并淡入下一个元素 并重复这个循环直到最后一个元素 然后循环