我是JQuery的新手,但已经很喜欢它了.
我试图在用户rollsovers时更改div的背景.但我不能让bg更新.到目前为止,这就是我所拥有的:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style>
#fish{background-image:url(images/fish_off.jpg);width:459px;height:474px;}
</style>
<script type="text/javascript" src="javascript/jquery.js"></script>
<script type="text/javascript">
$('#fish').hover(
function(){$('#fish').css({background: "url(images/fish_on.jpg)"})},
function(){$('#fish').css({background: "url(images/fish_off.jpg)"})}
);
</script>
</head>
<body>
<div id="fish"></div>
</body>
</html>
这是我的测试页面,基于以下信息,我仍然遇到问题:
使用.mouseenter()或者如果你想在mouseout上应用一个类,也可以使用.hover() http://api.jquery.com/mouseenter/ http://api.jquery.com/hover/
$("div").hover(
function () {
$(this).css("background", "#ddd");
},
function () {
$(this).css("background", "#ccc");
}
);
如果你只是想要一个推杆,你也可以通过css完成这个
#fish { background: #fff;
#fish:hover { background: #ccc; }
看看这个工作小提琴使用悬停 http://jsfiddle.net/faLdY/
通过jquery应用背景图像略有不同checkout这个类似的问题 用jQuery切换DIV背景图像
请注意css在您的示例页面中应用的方式,您正在错误地执行此操作.
更改
$('#fish').hover(
function(){$('#fish').css({background: "url(images/fish_on.jpg)"})},
function(){$('#fish').css({background: "url(images/fish_off.jpg)"})}
);
对此
$('#fish').hover(
function(){$('#fish').css("background-image", "url(images/fish_on.jpg)")},
function(){$('#fish').css("background-image", "url(images/fish_off.jpg)")}
);
编辑:
这是一个工作小提琴,完全按照你的要求 http://jsfiddle.net/C7KxR/
这是直接链接到你的图像,顺便说一句.我希望没关系.