0
我是新来的HTML和CSS。我有以下代码,我需要用放大图像和缩小图像替换文本放大和缩小。
下面是我想替换(粗体)的放大和缩小与zoom_in.png和zoom_out.png上面的代码(粗体)文本代码替换图像而不是文本
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script type='text/javascript' src='//code.jquery.com/jquery-1.10.1.js'></script>
<style type='text/css'>
.imgs{
position:relative;
width:70px;
height:70px;
z-index:100;
}
.imgs div{
position:absolute;
top:0px;
left:15px;
font-size:20px;
color:red;
font-weight:bold;
}
.imgs div span{
cursor:pointer;
}
</style>
<script type='text/javascript'>//<![CDATA[
$(window).load(function(){
var totalImgs=$('img').length;
$('img').each(function(){
var imgSel=$(this);
var imgActualWidth = $(this).width();
$(this).wrap("<div class='imgs'></div>");
var par=$(this).parent();
par.css({'z-index':''+totalImgs+''});
totalImgs=totalImgs-1;
par.append("<div><span>**zoom-in**</span> <span>**zoom-out**</span></div>");
par.children('div').on('click','span:nth-child(1)',function(){
imgSel.width(imgSel.width()+imgActualWidth);
});
par.children('div').on('click','span:nth-child(2)',function(){
if(imgSel.width()>imgActualWidth)
{
imgSel.width(imgSel.width()-imgActualWidth);
}
});
});
});//]]>
</script>
</head>
<body>
<img src="images/course_layout.jpg"/>
</body>
</html>
。我想要将图像置于网页中央,并将图像周围的背景变为黑色。我怎样才能做到这一点。
这不是工作 – user3004356