JQuery实现点击按钮切换图片(附源码)--JQuery基础
JQuery实现切换图片相对比较简单,直接贴代码了哈,有注释噢!疑问请追加评论哈,不足之处还请大佬们指出!
1、案例代码:
demo.html:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JQuery实现点击按钮切换图片</title>
<style type="text/css">
*{
margin:0;
padding:0;
}
.box{
text-align: center;/*将box里的内容居中显示*/
}
.btn{
display: inline-blocki;/*让a标签变成行内块级元素*/
height: 30px;
line-height: 30px;
border:1px solid #ccc;
text-decoration: none;
color: #333;
padding: 5px;
font-size: 12px;
}
.btn:active{
background-color: #666;
color: white;
}
</style>
</head>
<body>
<div class="box">
<img src="images/1.jpg" alt="pic" ></html>
2、Effect Picture