javascript - onMouseOver 改变背景图片位置

标签 javascript css

我正在尝试使用 javascript 重新定位 div 的背景图像。这是我所拥有的,但它似乎不起作用。我错过了什么?

<a href="#" onMouseOver="document.getElementById('rubbish_image').style.backgroundPosition="0px 150px"">link one</a>
<a href="#" onMouseOver="document.getElementById('rubbish_image').style.backgroundPosition="0px 350px"">link two</a>

<div id="rubbish_image"></a>

最佳答案

我不完全确定,但是我可以看到您的 JavaScript 有两个明显的问题:

  1. 您在 a 标记的结束 > 之前有 两个 ",因此的
  2. 您在 字符串中使用 ",这是不允许的(您可以在用 ' >",反之亦然,但 " 位于由 " 分隔的字符串内,终止字符串)。

因此,我建议将代码修改为:

<a href="#" onMouseOver="document.getElementById('rubbish_image').style.backgroundPosition='0px 150px';">link one</a>
<a href="#" onMouseOver="document.getElementById('rubbish_image').style.backgroundPosition='0px 350px';">link two</a>

我不认为这是个大问题,但您也没有在 onmouseover 属性中终止您的 JavaScript,所以我还在末尾添加了 ;每一个。

关于javascript - onMouseOver 改变背景图片位置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6447386/

相关文章:

javascript - 如何从firebase列表中删除项目

javascript - JQuery 整理代码

html - 将文本放入 div 中心的问题

css - 如何将 bootstrap-vue 图标包含到 nuxtjs 中?导航栏向下箭头的问题

css - Ionic 中的错误框

javascript - highland.js: map 功能未按预期工作

javascript - 我的喜欢/不喜欢系统没有按预期工作 php

javascript - 我可以从 Service Worker(或辅助线程)重新加载页面吗?

css z-index 问题

html - 如何在小屏幕尺寸下将标签放在它们之间