HTML当鼠标经过图片上的文字时显示另一张图片，求代码

 我来答

1个回答

#热议# 不吃早饭真的会得胆结石吗？

来自地球qr
2016-11-29 · TA获得超过127个赞

知道小有建树答主

回答量：153

采纳率：0%

帮助的人：15.2万

我也去答题访问个人页

关注

展开全部

<!--
<html>
<head>
<title>代码</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<script type="text/javascript" src="js/jquery-1.10.1.js"></script>
<script>
$(function()
{
	$("p").mouseover(function() 
	{
		var url=$(this).find("img").attr("src"); 
		url="url("+url+") no-repeat";
		$(".content").css("background",url).css("background-position","50%").css("background-size","contain"); 
	
	});	
});
</script>
</head>
<style type="text/css">
	.bottle{
	position: relative;
	width:800px;
	height:800px;
	margin:0 auto;
	margin-top:100px;
	}
	
	.content{
	height: 300px;
	width: 300px;
	position: absolute;
	background: url(imgs/1.jpg) no-repeat;
	background-size: contain;
	margin-left:250px;
	top: 100px;
	}

	p img{
	width:80px;
	height:80px;
	}
	
	.p1{
	position:absolute;
	left:573px;
	top:343px}
	.p2{
	position:absolute;
	left:158px;
	top:169px}
	.p3{
	position:absolute;
	left:568px;
	top:58px
	}
	
</style>
<body>

<div  class="bottle">
<div class="content"></div>
	<p class="p1"><img src="imgs/0.jpg" ></p>
	<p class="p2"><img src="imgs/1.jpg" ></p>
	<p class="p3"><img src="imgs/2.jpg" ></p>
</div>
</body>
</html>
-->
去掉<!-- -->


本回答被提问者和网友采纳






已赞过已踩过<

你对这个回答的评价是？
评论收起