ul {
padding:0;
margin:0;
}
li {
list-style:none;
}
body {
background:#333;
}
#pic {
width:400px;
height:500px;
position:relative;
margin:0 auto;
background:url(3.jpg) no-repeat center black;
}
#pic img {
width:400px;
height:500px;
}
#pic ul {
width:40px;
position:absolute;
top:0;
right:-50px;
}
#pic li {
width:40px;
height:40px;
margin-bottom:4px;
background:#666;
}
#pic .active {
background:#FFCC33;
}
#pic span {
top:0;
}
#pic p {
bottom:0;
margin:0;
}
#pic p,#pic span {
position:absolute;
left:0;
width:400px;
height:30px;
line-height:30px;
text-align:center;
color:#fff;
background:black
}
使用原生js 实现的 图片点击效果 没什么难度 不喜轻喷 谢啦~~