jquery实现一个带进度的在线答题测验出结果代码

代码语言:html

所属分类:其他

代码描述:jquery实现一个带进度的在线答题测验出结果代码

代码标签: jquery 进度 在线 答题 测验 结果 代码

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

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">

    <style>
        .main-quiz-holder {
	margin:0 auto;
	position:relative;
	background:#FCFCFC;
	border:1px solid #dedede;
	box-shadow:0 1px 5px #D9D9D9,inset 0 10px 20px #F1F1F1;
	-o-box-shadow:0 1px 5px #D9D9D9,inset 0 10px 20px #F1F1F1;
	-webkit-box-shadow:0 1px 5px #D9D9D9,inset 0 10px 20px #F1F1F1;
	-moz-box-shadow:0 1px 5px #D9D9D9,inset 0 10px 20px #F1F1F1;
	border-radius:20px 2px 20px 2px;
	position:relative;
	width:600px;
}
.main-quiz-holder * {
	margin:0;
	padding:0;
	font-family:"Microsoft yahei",sans-serif;
}
.main-quiz-holder a {
	text-decoration:none;
	color:#6C6C6C;
}
.main-quiz-holder .slide-container {
	width:500px;
	padding:20px 50px 50pt 50px;
}
.results-container,.intro-container {
	text-align:center;
}
.results-container {
	}.main-quiz-holder .slide-container .question,.main-quiz-holder h2.qTitle {
	margin:10px 0 20px 0;
	font-size:20px;
	font-weight:normal;
}
.main-quiz-holder h2.qTitle {
	font-size:20px;
	margin-top:30px;
	line-height:26px
}
.main-quiz-holder .question-number {
	position:absolute;
	right:10px;
	top:10px;
	border:1px solid #F6F6F6;
	padding:5px;
	background:#F0F0F0;
	text-shadow:0 1px 0 rgba(255,255,255,0.3);
	-webkit-box-shadow:inset 0 0 0 1px rgba(255,255,255,0.2),inset 0 0 6px 0 rgba(255,255,255,0.3),0 1px 2px rgba(0,0,0,0.4);
	-moz-box-shadow:inset 0 0 0 1px rgba(255,255,255,0.2),inset 0 0 6px 0 rgba(255,255,255,0.3),0 1px 2px rgba(0,0,0,0.4);
	box-shadow:inset 0 0 0 1px rgba(255,255,255,0.2),inset 0 0 6px 0 rgba(255,255,255,0.3),0 1px 2px rgba(0,0,0,0.4);
	border-radius:3px;
	color:#949494;
}
.main-quiz-holder .slide-container ul.answers {
	margin:0px;
	padding:5px;
	list-style:none;
}
.main-quiz-holder .slide-container ul.answers li {
	cursor:pointer;
	padding:5px 30px;
	margin:12px 0;
	color:#4c4c4c;
	-webkit-border-radius:4px;
	-moz-border-radius:4px;
	border-radius:4px;
	text-shadow:0 1px 0 rgba(255,255,255,0.3);
	-webkit-box-shadow:inset 0 0 0 1px rgba(255,255,255,0.2),inset 0 0 6px 0 rgba(255,255,255,0.3),0 1px 2px rgba(0,0,0,0.4);
	-moz-box-shadow:inset 0 0 0 1px rgba(255,255,255,0.2),inset 0 0 6px 0 rgba(255,255,255,0.3),0 1px 2px rgba(0,0,0,0.4);
	box-shadow:inset 0 0 0 1px rgba(255,255,255,0.2),inset 0 0 6px 0 rgba(255,255,255,0.3),0 1px 2px rgba(0,0,0,0.4);
	background:#f6f6f6;
	background:-webkit-gradient(linear,left top,left bottom,from(#f6f6f6),to(#d4d4d4));
	background:-webkit-linear-gradient(#f6f6f6,#d4d4d4);
	background-image:-moz-linear-gradient(top,#f6f6f6,#d4d4d4);
	background-image:-moz-gradient(top,#f6f6f6,#d4d4d4);
	border:1px solid #a1a1a1;
}
.main-quiz-holder .slide-cont.........完整代码请登录后点击上方下载按钮下载查看

网友评论0