gpt4 book ai didi

jquery - 悬停以更改背景图像而不是背景颜色

转载 作者:行者123 更新时间:2023-11-28 12:41:13 25 4
gpt4 key购买 nike

有人可以用这段代码指导我吗?当前,当我将鼠标悬停在链接上时,它会更改另一个 div 上的背景颜色。我不想更改背景颜色,而是想更改为另一个背景图像。

<html>
<head>
<title>Sample</title>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<style>
body {
background: #ccc;
transition:0.5s;
}
</style>
<script type="text/javascript">
$(document).ready(function () {
$("#div-1").hover(
function () {
$('#top_section').css("background", "#ff9900");
},
function () {
$('#top_section').css("background", "#ccc");
}
);

$("#div-2").hover(
function () {
$('#top_section').css("background", "red");
},
function () {
$('#top_section').css("background", "#ccc");
}
);

$("#div-3").hover(
function () {
$('#top_section').css("background", "yellow");
},
function () {
$('#top_section').css("background", "#ccc");
}
);
});
</script>
</head>
<body>

<a id="div-1" href="#"> Orange</a>
<a id="div-2" href="#">Red</a>
<a id="div-3" href="#">Yellow</a>
<div id="top_section" style="height:100px;width:100px;"></div>
</body>
</html>

我正在将行 $('#top_section').css("background", "#ff9900"); 更改为 $('#top_section').css("background-image", "/images/image1.jpg"); 但是当我将鼠标悬停在链接上时没有任何反应。非常感谢,

最佳答案

您需要用 url('...') 将您的图片 url 括起来。

尝试将 $('#top_section').css("background-image", "/images/image1.jpg"); 更改为 $('#top_section')。 css("背景图片", "url('/images/image1.jpg')");

或参见http://codepen.io/ckuijjer/pen/giABb举个例子

关于jquery - 悬停以更改背景图像而不是背景颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26424636/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com