本文介绍了jquery onclick更改CSS背景图像的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我使用这个代码来获取菜单tab.when我鼠标在选项卡上的标签图像将改变,类似地,我想改变图像的tab onlick使用jquery.i使用下面的代码,这样做,但我不能可以这样做。
am using this code to get menu tab.when i mouseover on the tab the tab image will change, similarly i want to change the image of tab onlick using jquery.i used the below code to do this but i was not able to get it.how can i do this.
<html>
<head>
<title>Css Menu</title>
<link rel="stylesheet" type="text/css" href="css/style.css">
<style>
.home {
background: url("images/tab2.png") repeat scroll 0 0 transparent;
border-radius: 4px 4px 0 0;
height: 75px;
left: 54px;
position: relative;
top: 25px;
width: 90px;
}
.home:hover {
background: url("images/tab3.png") repeat scroll 0 0 transparent;
border-top: 1px solid black;
border-left: 1px solid black;
border-right: 1px solid black;
}
</style>
<script type="text/javascript">
$(function() {
$('.home').click(function() {
$('home').css('backgroundImage', 'url(images/tabs3.png)');
});
}):
</script>
</head>
<body><div class="frame">
<div class="header1"></div>
<div class="header2">
<a href="#"><div class="home" onclick="function()"><img src="images/tools.png" class="image"><br><span class="align">Home</span></div></a>
</div>
<div class="header3"></div>
</div>
</body>
</html>
推荐答案
您需要使用 background-image ,而不是 backgroundImage 。例如:
You need to use background-image instead of backgroundImage. For example:
$(function() {
$('.home').click(function() {
$(this).css('background-image', 'url(images/tabs3.png)');
});
}):
这篇关于jquery onclick更改CSS背景图像的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!