jquery实现移动端手机端简易大转盘效果代码

代码语言:html

所属分类:大转盘

代码描述:jquery实现移动端手机端简易大转盘效果代码

代码标签: 手机 简易 转盘 效果

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="content-type" content="text/html" charset="utf-8" />
	<meta name="viewport" content="initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<style>
    html,body,div,img,a{
	margin:0;
	padding:0;
	font:normal normal 300 16px/1.5 "微软雅黑",arial,verdana;
}
.btn,.btn:hover.btn:visited{
	color:#ffffff;
	background-color:#fd5b78;
	margin:10px auto;
	display:block;
	text-align: center;
	width:240px;
	height:40px;
	line-height:40px;
	border:1px solid #DE3163;
	border-radius:4px;
	cursor:pointer;
}
.btn:active{
	background-color:#e46084;
}
.btn1,.btn1:hover.btn1:visited{
	color:#ffffff;
	background-color:#008573;
	margin:10px auto;
	display:block;
	text-align: center;
	width:240px;
	height:40px;
	line-height:40px;
	border:1px solid #00755E;
	border-radius:4px;
	cursor:pointer;
}
.btn1:active{
	background-color:#00755E;
}
.rotate_wrap{
	width: 90%;
	max-width: 300px;
	height: 300px;
	margin: 20px auto 50px;
	position:relative;
}
.bg_img{
	width:100%;
	position:absolute;
	top:0;
	left:0;
}
.cont_img{
	width: 31px;
	position: absolute;
	top: 72px;
	left:135px;
}
.rotate_origin{
	transform-origin: 50% 50%;
	-ms-transform-orig.........完整代码请登录后点击上方下载按钮下载查看

网友评论0