jQuery 原地弹跳

2023-12-04

我需要我的列表项元素弹跳到位,而不是相互掉落。

我创建了一个 JSFiddle 来表达我的意思:http://jsfiddle.net/RGvjj/

有人可以告诉我为什么这些元素会这样做以及我需要做什么来解决这个问题吗?


尝试删除inline显示从<li>并使用float:left反而。

试试看: http://jsfiddle.net/RGvjj/1/

#navigation li {
    font-size: 20px;
    margin-left: 10px;
    padding-left: 10px;
    border-left: 3px solid #1161A5;
    color: #ffffdd;
    text-decoration: none;
    float:left;
}

EDIT:为了解释一下,我猜这种情况正在发生,因为当你为一个元素设置动画时,jQuery 会改变display to block。所以你最终得到的是block元素(<a>)内inline元素(<li>)这是行不通的。

通过使用float:left, the <li>保留其block显示,这使得它有效<a> to be block.

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

jQuery 原地弹跳 的相关文章

  • 推文按钮不出现

    我正在尝试向 html 页面添加一个 tweet 按钮 我使用 Twitter 按钮生成器中的官方代码 http twitter com about resources buttons tweet http twitter com abou
  • 使用 html 敏捷包解析 html

    我想从这个 div 中收集所有标签 但不知道如何使用 xpath 方法以最佳方式做到这一点 div class biz info h3 a href profil 78122 s C3 B8rby rehab S rby Rehab a h
  • HTML 和 标签有什么区别?

    HEAD 标签和 BODY 标签有什么区别 大多数 HTML 书籍仅 简短 提及 and 标签 但它们消失得很快 它们会影响浏览器呈现网页的方式吗 另外 它们会影响 javascript 的运行顺序吗 我的意思是 如果我里面有一个javas
  • Rails、REST 架构和 HTML 5:带有预检请求的跨域请求

    在致力于使我们的网站 HTML 5 友好的项目时 我们渴望采用跨域请求的新方法 不再通过隐藏的 iframe 发布 使用访问控制 http www w3 org TR access control 根据规范 我们开始设置一些测试来验证各种浏
  • 文本的彩虹色

    rainbowtext background image webkit gradient linear left top right top color stop 0 f22 color stop 0 15 f2f color stop 0
  • jQuery 可以操作插入的元素吗?

    我是 jQuery 的新手 我认为 jQuery 可以操作由代码添加的元素是合理的 但我发现现在还不能 function addVideo click function publisher append div div
  • 无法在 Chrome 中获取对象的真实高度/宽度

    我有一个问题 如果我在 css 中设置图像高度并尝试获取高度 宽度 我会在不同的浏览器中得到不同的结果 有没有办法在所有浏览器中获得相同的尺寸 你可以找到一个活生生的例子here http web cinaird se pdf tester
  • 如何设置必须输入特定数字的字段?

    我想知道如何创建一个需要输入特定数字或文本的字段 例如 激活码 以及在输入的确认答案的情况下移动到 网页 并且在未确认的情况下移动到 另一页面 的按钮 使用必需的属性
  • 在 jQuery 中获取 SELECT 的值和文本[重复]

    这个问题在这里已经有答案了 可能的重复 获取选择框中选定选项标签的值 https stackoverflow com questions 7380604 getting the value of the selected option ta
  • fadeOut() 和slideUp() 同时进行?

    我已经发现jQuery 淡出然后滑动 https stackoverflow com questions 734554 jquery fadeout then slideup这很好 但不是那个 我怎么能够fadeOut and slideU
  • 网格布局:创建 CSS,以便元素在调整相邻元素大小时保持位置

    我想在网格布局中构建一个简单的图像库 并且我正在使用类似的东西悬停时缩放 http www javascript fx com navigation imagezoom general help help html缩放悬停图像 但我宁愿使用
  • 修改 Twitter 帖子上可编辑 Div 的内容

    我正在编写一个 chrome 扩展 它可以帮助用户在 Twitter 上输入内容 当在 twitter 上写推文时 twitter 会打开一个可编辑的 div 容器 当用户输入内容时 twitter 大概正在使用某些网络框架 会生成子 di
  • Next.js:错误:React.Children.only 期望接收单个 React 元素子元素

    我有一个名为Nav inside components目录及其代码如下所示 import Link from next link const Nav gt return div a Home a a About a div export d
  • 选择 asp.net CheckBoxList 中的所有项目

    ASP NET 和 C 我想要一个带有 全选 项目的复选框列表 当这个特定项目是 已选择 所有其他都将被选择 也 当选择被删除时 这个项目 也将来自所有人 其他物品 选中 取消选中 任何其他项目只会有一个 对特定项目的影响 无论选择状态如何
  • Angularjs : $locationProvider.hashPrefix("!") ;

    我想将网址显示为 www test com 因为我正在使用 locationProvider hashPrefix 但它显示网址为 www test com 我想 哈希之前而不是哈希之后 Thanks var app angular mod
  • 将 JSON 属性绑定到表单

    我有一个 JSON 对象和一个
  • JQuery UI:将长元素放在光标位置而不是元素的中间

    我有一些很长的可拖动元素 可以将它们放入背景表的所有单元格中 当我开始拖动此类元素并将其悬停在可放置容器 表格的单元格 上时 了解元素将被放置到何处的 热点 点是其自身的中间 不幸的是 我的元素的中间通常不可见 并且将元素放在正确的位置是没
  • 减小 TinyMCE 文本区域中的行间距

    I am using TinyMCE to provide a rich text editing text editor But the line spacing between the lines is too much I have
  • 区分 NaN 输入和输入类型为“number”的空输入

    我想使用 type number 的表单输入 并且只允许输入数字
  • HTML 表格 - 固定列宽和多个可变列宽

    我必须建立一个有 5 列的表 表格宽度是可变的 内容宽度的 50 有些列包含固定大小的按钮 因此这些列应该有一个固定大小 例如 100px 有些列中有文本 所以我希望这些列具有可变的列宽 例如 Column1 tablewidth sum

随机推荐

  • 创建进程以在新的 Windows 桌面上运行 IE

    我正在尝试设置一个 IE kiosk 在单独的桌面上运行 IE 当我测试时 我只是正常启动 IE 不是在 kiosk 模式下 但是尽管 IE 在新桌面上启动 但它不会加载命令字符串中指定的初始页面 它只是坐在那里 沙漏闪烁打开和关闭非常快
  • 无法编译 C# 默认接口方法

    C 8 0 有一个新功能 可以让您向接口上的方法添加默认实现 要么我做错了什么 要么这个功能没有像宣传的那样工作 我猜是前者 我使用以下代码创建了一个新的 NET Core 3 1 控制台应用程序 using System namespac
  • JQuery .append 标记被忽略[重复]

    这个问题在这里已经有答案了 我有以下 HTML div div
  • 使用外键作为第一个表的标识列批量插入嵌套 xml

    我有一个 xml 如下
  • 使用提交按钮时,ajax 调用不起作用

    我正在尝试使用以下 API 获取实时货币汇率 http www exchangerate api com INR USD 1 k FQRxs xT2tk NExQj 当我点击按钮时 它会提醒费率并且工作正常 我正在使用以下 Ajax 代码
  • 仅将 AngularJS 用于路由目的

    我刚刚被分配了一个完全用 jQuery 制作的网站 它异步加载几个页面 并且想成为一个SPA 现在唯一的问题是开发人员没有考虑一般的 URL 人们无法通过 www example com 以外的任何其他方式访问该网站 我对 AngularJ
  • std::move(const shared_ptr 引用) 是什么意思?

    以下是我正在尝试的玩具代码 我理解第一个和第二个 第一个将所有权授予 p 第二份副本p to p 但我不明白第三个 什么是std move of const shared ptr 意思是 谢谢 class P class A public
  • GADT 的解析和使用

    我在编写解析器时遇到了问题 具体来说 我想要不同类型的返回值 例如 我有两种不同的数据类型FA and PA代表两种不同的脂质类别 data FA ClassLevelFA IntegerMass FA CarbonChain derivi
  • Haskell 并不懒惰地评估交错

    我正在解决一个问题 它来自 UPenn 课程 但我没有接受它 只是通过它来学习 Haskell 重点是构造一个 Stream 如下定义 由 ruler 定义 标尺 n 能除以 n 的 2 的最高次幂的指数 问题是 我认为下面标尺的定义应该延
  • 节点 5.5.0 已安装,但节点 -v 在 OS X 和自制软件上获取“v4.2.1”?

    我正在尝试将我的nodejs v4 2 1更新到最新版本并成功获得 但node v仍然给我 v4 2 1 可能较旧的节点先于较新的节点出现在您的 PATH 中 您可以在 shell 中运行 which node 查看默认运行的 Node 二
  • 如何制作仅包含 jinja 模板的 python 包

    目前有一个项目 我正在尝试扩展 jinja2 模板 这些模板存在于我正在尝试制作的 python 包中 现在我正在努力制作一个 python 包 html文件 这是我目前拥有的 sharedtemplates setup py templa
  • 使用 ProcessPoolExecutor 时更新变量

    if name main MATCH ID str doc ref2 id MATCH ID TEAM doc ref3 id with concurrent futures ProcessPoolExecutor max workers
  • 缩小时聚类地图标记,放大时不聚类

    我正在使用Google Map Android 集群实用程序具有 Google 地图 v2 播放服务 我没有得到我预期的行为 正如您在下面的两张图片中看到的那样 当放大时 我可以看到 20 个簇和左侧的单个标记 但是当我缩小直到它们彼此重叠
  • r c将一个数据帧的单个列与另一个数据帧绑定,而不更改列名

    假设我有两个数据框 df1 data frame x 1 4 y 2 5 df2 data frame x2 1 4 y2 2 5 如果我 cbind df1 和 df2 一切正常 gt cbind df2 df1 x2 y2 x y 1
  • RewriteRule后如何在地址栏中保留原始URL

    这是我的 htaccess 文件 Options FollowSymLinks
  • 向 SNS 发送后续 CloudWatch 警报通知

    当我使用 CloudWatch 警报触发 AutoScaling 操作时 它会重复触发 ASG 操作 换句话说 具有状态 ALARM 的后续 N 个警报集将触发 ASG 上的 N 个操作 SNS 操作未观察到此行为 而是仅在警报从 正常 更
  • 在 pandas 数据帧上设置多重索引的最佳方法

    我有一个数据框df与这些列 Group Year Gender Feature 1 Feature 2 Feature 3 后面我想用MultiIndex来堆叠数据 我尝试了这样的方式 df index pd MultiIndex from
  • react-native-firebase 通知中的深层链接

    我使用带有消息传递功能的react native firebase通过云功能向我的应用程序发送通知 使用admin messaging send message 与这里非常相似 https medium com the modern dev
  • findIndex() JavaScript 数组对象

    var array one 1 two 2 one 3 two 4 var result array findIndex function value if value 2 return false return true console
  • jQuery 原地弹跳

    我需要我的列表项元素弹跳到位 而不是相互掉落 我创建了一个 JSFiddle 来表达我的意思 http jsfiddle net RGvjj 有人可以告诉我为什么这些元素会这样做以及我需要做什么来解决这个问题吗 尝试删除inline显示从