背景颜色属性向上滑动

2024-01-04

问题出在transitionBackground函数中。在这种情况下,当按下页面上的向上按钮时,该函数就会触发。

    <html>
    <head>
    <title>Case: Background Transitions</title>
    <script src="jquery/jquery.js"></script>
    <script>
      $(
        var transitionBackground = function (){
          if ($(div).css("background") === "blue"){
            //convert to green by having the green background start at the bottom, 
            //and slide up (over say, a period of 1 second)
            //I'll up vote a pure-css, pure-js, or a jquery answer, 
            //but I prefer jquery or pure-css answers.
            //Thanks in advance.
          } else {
            //convert back to blue if pressed again.
            //you don't have to do this;
          }
        };

        var arrowDown = {left:false, right:false, up:false, down:false};
        var arrow = {left: 37, up: 38, right: 39, down: 40 };

        $(document.documentElement).keydown(function (e) {  //a key was clicked
          var keyCode = e.keyCode || e.which

          switch (e.keyCode) {
            case arrow.up:  //the up key was clicked/pressed
              if (arrowDown.up === false){  //tell if clicked or pressed
                transitionBackground();
              }
              arrowDown.up = true
              break;
            default: //other keys
              return true;
              break;
          }
          return false;  //stop default behavior
        });

        $(document.documentElement).keyup(function (e) { //a key was relased
          var keyCode = e.keyCode || e.which

          switch (e.keyCode) {
            case arrow.up:  //the up key was released
              arrowDown.left = false;
              break;
            default: //other keys
              return true;
              break;
          }
          return false; //stop default behavior
        });
      );
    </script>
  </head>
  <body>
    <div style="height: 3em; width: 3em; background:blue"></div>
  </body>

下面是一个使用两个 div 的切换函数的示例:http://jsfiddle.net/SmAHU/ http://jsfiddle.net/SmAHU/(大致基于Nick011的回复)

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

背景颜色属性向上滑动 的相关文章

  • 只保留 A-Z 0-9 并使用 javascript 从字符串中删除其他字符

    我正在尝试验证字符串以使它们成为有效的网址 我只需要保留 A Z 0 9 并使用以下命令从字符串中删除其他字符javascript or jquery 例如 贝儿餐厅 我需要将其转换为 百丽餐厅 所以字符被删除 只保留 A Z a z 0
  • 我应该如何实现将状态保存到 localStorage?

    CODE var React require react var Recipe require Recipe jsx var AddRecipe require AddRecipe jsx var EditRecipe require Ed
  • 使用 Javascript/Node.js 在代码内执行 mongoimport

    node js javascript 中是否有任何库可供个人使用mongoimport在代码中 据我了解 mongoimport 有点像 exe 您必须先执行它 然后才能使用其文本输入环境 是否可以在我的代码中执行 mongoimport
  • 如何在 Chrome 中获取 div 上的 keydown 事件?

    我想在 div 上获取 keydown 事件 我使用 JQuery keydown 很简单 但是 它不适用于 Chrome 为了在 chrome 上工作 我必须设置 tabindex 0 如果我这样做 Chrome 会在我的 div 周围放
  • ES6 静态方法引用 self? [复制]

    这个问题在这里已经有答案了 我有两节课 存储库和用户存储库 我想在 Repository 中定义一个静态方法 该方法在运行时调用 UserRepository 中的静态函数 有什么干净的方法可以做到这一点吗 class Repository
  • JavaScript 错误:MVC2 视图中的条件编译已关闭

    我试图在 MVC2 视图页面中单击时调用 JavaScript 函数 a href Select a JavaScript 函数 function SelectBenefit id code alert id alert code 这里 b
  • Sphinx内联代码高亮

    我使用 Sphinx 制作一个包含代码示例的网站 我成功地使用了 code block获取语 法高亮的指令 但我无法使用此代码获得内联语法突出显示 role bash code language bash Test inline bash
  • 检查浏览器空闲的替代方法

    我有一个简单的网络信息亭 在鼠标未使用 jQuery 移动 30 秒后显示用户操作提示 var i null body wrap mousemove function clearTimeout i overlay fadeOut i set
  • 为什么我的 D3 SVG 图上的轴不会更新?

    I have 简单的 D3 散点图 http www raxacoricofallapatorius com test scattertest html我在显示数据的几个不同属性之间切换 但是虽然我可以更改数据点 并按照我想要的方式进行转换
  • 如何在 Javascript 中连接 C# ActiveX 事件处理程序

    我尝试使用几个代码片段将 ActiveX 对象与 Javascript 事件处理程序挂钩 我无法确定为什么事件处理程序没有被调用 带有项目的 Github 存储库 https github com JesseKPhillips Csharp
  • 从请求url获取hash参数

    我有这样的网址 http www coolsite com daily plan id 1 http www coolsite com daily plan id 1解析该字符串并读取哈希值 id 之后的值 的最简单方法是什么 谢谢 在客户
  • 如何使用 Javascript OAuth 库不暴露您的密钥?

    看着Twitter OAuth 库 https dev twitter com docs twitter libraries 我看到了这个注释 将 JavaScript 与 OAuth 结合使用时要小心 不要暴露你的钥匙 然后 看着jsOA
  • PHP Json_encode 将空格更改为加号 +

    我有一个网络应用程序 我首先将 JSON 数据存储在 cookie 中 然后每 x 秒保存到数据库 它只是打开与服务器的连接 服务器读取 cookie 它实际上并不通过 POST 或 GET 发送任何内容 当我保存到 cookie 时 我的
  • 表单 CSS:根据选中/未选中状态设置单选框的父级(标签)样式

    所以我有一个表格 表格中提出的大多数问题都是使用无线电输入 我要和
  • 标题的下边框小于宽度

    我需要创建一个下划线效果底部边框小于h2标题的宽度 通常我不上传图片 但我认为这可能有助于进一步解释问题 您可以为此使用伪元素 例子 http jsfiddle net SZ39x pseudo border position relati
  • 如何使用 jQuery 过滤 DropDownList 中的选项

    我有 2 个 DropDownList 第一个 DropDownList 有 4 个选项 第二个 DropDownList 有 20 个选项 我想要一个选项value 1在第一个 DropDownList 中选择我在第二个 DropDown
  • 如何将数据推送到嵌套对象

    如何将另一个元素推入variables来自以下对象的属性 var request name Name id 3 rules name Rule name tags tagId 1 variables variable var1 matchT
  • 议程周视图中的标题显示因加载的 fullcalendar js 文件而异

    在议程周视图中 日历标题中各天之间显示的破折号根据我加载的 fullcalendar js 显示有所不同 例如 如果我加载完整的 calendar js 文件 它会按预期工作 2015 年 2 月 8 日至 14 日 使用此脚本标签 当我尝
  • highchart堆积柱每个类别的总数据

    我想获取每个类别的总数据 这point stackTotal只给出活动数据的总数 从我粘贴的代码示例中 我想知道每种水果的总消耗量 因此 即使我单击右上角图例上的乔的名字 这使得堆叠图表上的所有乔信息都处于非活动状态 我仍然可以知道约翰 简
  • 从后面的代码添加外部 css 文件

    我有一个 CSS 文件 例如 SomeStyle css 我是否可以将此样式表文档从其代码隐藏应用到 aspx 页面 您可以将文字控件添加到标头控件中 Page Header Controls Add new System Web UI L

随机推荐

  • 是否值得将distinct() 与collect(toSet()) 一起使用

    将流的元素收集到集合中时 同时指定是否有任何优点 或缺点 distinct 在流上 例如 return items stream map distinct collect toSet 考虑到该集合已经删除了重复项 这似乎是多余的 但是它是否
  • Javascript 检测 mouseup 上按住的控制键

    我查了很多资料 似乎找不到满意的解决方案 我希望有人能帮帮忙 当我使用 jQuery 时 我还编写了数千行 JavaScript 所以 纯 JavaScript 解决方案就可以了 我正在尝试确定控制键是否被物理按住mouseup事件 就是这
  • 如果 LINQ 中的列为空,如何忽略“where”和“order by”条件

    我有交易对象列表 并希望根据当前用户所在的视图按特定条件对它们进行排序 我遇到的问题是 为了在 where 子句中添加条件 首先我需要检查它是否为空以防止空指针异常 这会导致列为 null 的记录被过滤掉 我想将它们包含在列表底部 如果该列
  • 如何从“Android终端模拟器”调用Rebol解释器?

    我需要从以下位置调用 Rebol 语言解释器作为运行脚本文件的命令 例如rebol script name reb 所以我不是在寻找仅在 Rebol 中启动的 APK 应用程序REPL http en wikipedia org wiki
  • 使用 Google Closure 的 @typedef 标签

    Google 的 Closure 编译器有一个 typedef 标签 但是可以在代码中使用它们吗 我知道它会起作用 但是它会让人皱眉吗 所以这是我的类型 The plan object s typedef typedef Object Ty
  • C# ListView显示

    伙计们 我是在 C 中实现 ListView 的初学者 我在 c net 中的这些代码遇到问题 我无法弄清楚输出显示的控件中发生了什么 看来我忘记了在 ListView 控件的属性中赋予值的内容 第二列值必须出现在第一列上 这是我的代码 u
  • 字符串初始化的区别

    首先 如果这是一个非常基本的问题 我很抱歉 我只是想知道以下字符串定义之间的区别 String x hello String y new String hello 我知道在 java 中 String 是一个类 它既不是原语也不是包装器 如
  • 如何更改 WCF 服务引用的地址?

    我有一个在内部使用的应用程序 并使用 WCF 在客户端和服务器部分之间进行通信 但是它很快需要部署到服务器名称不同的站点 WCF 服务使用 netTcp 绑定作为 Windows 服务托管 目前 服务的地址是使用 Visual Studio
  • C# - 将文本与图像合并

    我编写了以下代码来合并 2 个图像 我的需求很简单 图像始终具有相同的尺寸 因此不需要定位 我可以稍后处理这个问题 我想知道的是 我可以修改它以将文本标签作为我的 imgFront 合并到图像 imgBack 上吗 最后返回的结果将是一个新
  • azure cdn purge不刷新缓存内容

    我有一个连接到 blob 存储的 Azure CDN Verizon 高级 基于此中的步骤 6 我制定了 2 条规则tutorial https blog lifeishao com 2017 05 24 serving your stat
  • 在键入并保留光标位置时强制 UITextField 小写

    用 Swift 2 编程 我有一个 UITextField 当用户在其中键入内容时 应在键入时自动转换为小写 因此不在表单验证之后 我已经走到这一步了 func textField textField UITextField shouldC
  • SQL 子句与表达式术语

    我与一位队友就以下主题进行了讨论 clause and expression可以互换使用 例如 调用代表某个变量的变量是否正确 常见 expression a b 例如 参与声明SELECT WHERE expression 一个子句 Ed
  • Linq to SQL for WebMatrix(网页)

    我想知道是否可以在基于 webmatrix 的网站 C Razor 等 中使用 Linq to SQL 我喜欢数据库搜索之类的东西 如果我可以使用 Linq to SQL 来实现这一点 那就太棒了 或者至少 将行作为数据集或其他内容返回 然
  • 如何限制列表对象模板侧而不是视图侧

    限制对象的方法之一是向这样的函数添加限制 def ten objects obj Model objects all 0 10 limit to 10 return objects obj 但是 如何在模板内而不是在视图内实现此目的 我知道
  • 什么是EOF!!在 bash 脚本中?

    有一个命令我不明白 custom command lt lt EOF 我想问什么是EOF 在 bash 脚本中 我确实用google找到了EOF 但是google会忽略 自动 所以我找不到 EOF 我知道文件结尾标记 但我不完全知道 的含义
  • iOS 使用 swift 创建通用 Alamofire 请求

    最近我开始学习使用 swift 开发 iOS 应用程序 所以我对它很陌生 我想在 swift 中实现rest api 调用并发现我们可以使用URLRequest 所以我写了generic method调用所有类型 例如get put pos
  • 如何在滑动嵌套recyclerview的cardview时禁用swiperefreshlayout

    当我在 swiperefreshlayout 中稍微向下滑动卡时 它认为我正在尝试刷新 我该如何避免这种情况 如果你有一个嵌套的RecyclerView 例如 命名为recyclerView您可以致电 recyclerView setNes
  • 在tomcat 8.5服务器上安装Godaddy ssl证书

    我正在尝试在我的网站上安装 SSL 证书 我正在使用Godaddy ssl 证书为了这 我已生成 csr 请求证书并将证书上传到我的服务器上 我正在使用 KEYTOOL 来使用所有这些 我从 godaddy 下载了 zip 文件中的三个文件
  • 如何在 g:select 中将 i18n 与 Grails/Groovy 枚举一起使用?

    我正在尝试在 Grails Groovy 枚举上进行 i18n 本地化 public enum Notification GENERIC 0 CONFIRM RESERVATION 100 CONFIRM ORDER 200 CONFIRM
  • 背景颜色属性向上滑动

    问题出在transitionBackground函数中 在这种情况下 当按下页面上的向上按钮时 该函数就会触发