如图要写网页编程,代码怎么写?
发布网友
发布时间:2022-04-30 11:45
我来回答
共2个回答
热心网友
时间:2022-06-21 23:02
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>图片相册</title>
<style type="text/css">
body{
min-width: 600px;
}
.album li {
list-style: none;
float: left;
margin:10px ;
display: block;
}
li img{
width: 100px;
height: 100px;
}
</style>
</head>
<body>
<ul class="album">
<li><img src="img/1.jpg" alt="" /></li>
<li><img src="img/2.jpg" alt="" /></li>
<li><img src="img/3.jpg" alt="" /></li>
<li><img src="img/4.jpg" alt="" /></li>
<li><img src="img/5.jpg" alt="" /></li>
<li><img src="img/6.jpg" alt="" /></li>
<li><img src="img/7.jpg" alt="" /></li>
<li><img src="img/8.jpg" alt="" /></li>
</ul>
</body>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script type="text/javascript">
$(function($){
$(".album li").on("mouseover","img",function () {
$(this).animate({"width":220,"height":220});
})
$(".album li").on("mouseout","img",function () {
$(this).animate({"width":100,"height":100});
})
})
</script>
</html>
这是最简单的了,数值的自己算,暂时就这样吧
热心网友
时间:2022-06-21 23:02
很简单,给钱就能做