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 元素然后循环重新启动 的相关文章

  • jQuery Dialog 和 Datepicker 插件出现问题

    我有一个对话框 对话框上有一个日期选择器字段 当我打开对话框并单击日期选择器字段时 日期选择器面板显示在对话框后面 我尝试了更多属性 z索引 堆栈 大框架 但没有成功 有人可以帮助我吗 Tks 旧答案 z index 注意连字符 是重要的属
  • 使用 jquery 远程图像属性

    目前我正在尝试获取远程图像宽度 高度 我正在开发一个链接共享模块 就像当你在 Facebook 上粘贴链接时 你可以看到标题 描述和图像 所以我尝试使用 php getimagesize 来获取图像宽度 高度 但速度非常慢 所以我正在考虑使
  • ajaxChosen 插件将无法工作

    我整个下午都在摆弄 ajaxChosen 因为我喜欢 Chosen 但我的选项值集变得太大了 我也尝试过 select2 但它太慢了 http harvesthq github io chosen http harvesthq github
  • socket.io 的良好初学者教程? [关闭]

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心 help reopen questi
  • 使用 css 简单地将对象居中,无需修改

    我想使用 CSS 将对象居中 而不需要任何技巧 这可能吗 如何实现 我已经尝试过了 但是我的 p 标签消失了 centered position fixed top 50 left 50 有多种方法可以使元素居中 但这取决于您的元素是什么以
  • Twitter 卡元标签问题

    有问题的网址 https www halleonard com viewpressreleasedetail action releaseid 10261 https www halleonard com viewpressreleased
  • 如何格式化 Highcharts 的 (x,y) 对数据的日期时间

    我的序列化方法会产生如下所示的日期时间字符串 2014 07 09T12 30 41Z 为什么下面的代码不起作用 function container highcharts xAxis type datetime series data x
  • 带有淘汰赛js的隐形recaptcha

    我正在完成隐形验证码 但我在实现它时遇到问题 谷歌开发人员页面中的代码显示它应该是这样的
  • 删除子元素上的 CSS 过滤器

    我的 CSS 代码有问题 正如您所看到的 我在 li 元素上有过滤器 但它覆盖了其他元素 我需要使其他两个元素没有过滤器 有没有可能这样做 main width 300px height 300px background color blu
  • 最大宽度调整以适应文本?

    不是最好的标题 但无论如何 我有一个元素max width和一些文字 如果文本长度超过一行所能容纳的长度 我会得到以下结果 My text here hello everyone 换句话说 它占据了完整的最大宽度 但由于单词向下移动 右侧有
  • Bootstrap按钮加载+Ajax

    我正在使用 Twitter Bootstrap 的按钮加载状态 http twitter github com bootstrap javascript html buttons http twitter github com bootst
  • JQuery Mobile 与 MVC 的链接

    我正在使用 ASP NET MVC 3 和 Razor UI 设置 JQuery 移动网站 我正在生成我的链接 例如 a href See Group 2 a 假设我从 Home Index 访问它 我遇到的问题是 当我点击链接时 它会出现
  • Javascript split 不是一个函数

    嘿朋友们 我正在使用 javascript sdk 通过 jQuery facebook 多朋友选择器在用户朋友墙上发布信息 但是我收到此错误friendId split 不是函数 这是我的代码 function recommendToFr
  • 刷新页面时保存用户的选择

    我目前有一个页面显示不同团队的数据 我有一些数据 用户可以单击使其处于 打开 或 关闭 状态 并为每个数据显示不同的图标 它基本上就像一个清单 只是没有物理复选框 我想记住哪些 复选框 已被选中 即使在用户刷新页面或关闭浏览器并稍后返回之后
  • DataTables row.add 到特定索引

    我正在替换这样的行项目 var targetRow entity row dataTable targetRow closest table dataTable DataTable dataTable row targetRow remov
  • 图像背景不透明度不影响边框

    如何设置背景不透明度而不影响边框线不透明度 我找到的解决方案没有帮助 div class selected img src assets img image product 1 thumbnail jpg alt product 1 thu
  • CSS3 信封形状

    正如您可能已经猜到的 该图像是邮件信封形状的一部分 如果可能的话 我想使用 CSS3 创建该形状 我已经制作了其他部分 但这个很棘手 该形状需要两侧都有三角形切口和圆角 大概是 border radius bottom left borde
  • 在移动设备上滚动

    这个问题更多的是一个建议研究 我确实希望它对其他人有帮助 并且它不会关闭 因为我不太确定在哪里寻求有关此事的建议 在过去的 6 个月里 我一直在进行移动开发 我有机会处理各种设备上的各种情况和错误 最麻烦的是滚动问题 当涉及到在网站的多个区
  • 如何创建适合屏幕宽度的等宽/高框? [复制]

    这个问题在这里已经有答案了 我正在尝试建立一个网站 其中有很多宽度和高度相等的框 例如 我有一个页面 其中并排有两个相同大小的框 简单的解决方案是将宽度和高度设置为 50vw 这在出现滚动条之前效果很好 我已经用谷歌搜索了几个小时 但无法理
  • 如何用另一个响应替换窗口的 URL 哈希?

    我正在尝试使用替换方法更改哈希 URL document location hash 但它不起作用 function var anchor document location hash this returns me a string va

随机推荐

  • 带 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 后淡出并淡入下一个元素 并重复这个循环直到最后一个元素 然后循环