刷题 - A8源码实例

基本信息
源码名称：刷题
源码大小：0.10M
文件格式：.rar
开发语言：CSS
更新时间：2019-06-16
友情提示：（无需注册或充值，赞助后即可获取资源下载链接）
嘿，亲！知识可是无价之宝呢，但咱这精心整理的资料也耗费了不少心血呀。小小地破费一下，绝对物超所值哦！如有下载和支付问题，请联系我们QQ(微信同号)：813200300
本次赞助数额为： 4 元　
源码介绍
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0,user-scalable=no">
<meta name="generator" content="bd-mobcard">
<meta http-equiv="Cache-Control" content="no-cache">

<script type="text/javascript" src="js.js"> </script>      
<script type="text/javascript" >
$(function(){
//        alert(document.title);
//        $('#begin').click(function(){
//            $('#notice').css('display','none');
//            $('#title').css('display','none');
////            var leftPos = (typeof window.screenLeft == "number") ? window.screenTop : window.screenY;
////            window.moveTo(200,0)
//             // $("#notice").scrollTop(1000);
//        //   alert($("#notice").offset().top);
//             scrollOffset($("#notice").offset()); 
////            // jQuery 定位让body的scrollTop等于pos的top，就实现了滚动 
//            function scrollOffset(scroll_offset) { 
//            $("body,html").animate({ 
//            scrollTop: scroll_offset.top 1000
//            }, 0); 
//            } ;
//         window.scroll(20000,2000); //2000代表定位到这个页面距离顶端2000px;
//         location.href = "#notice";
//          $('.test:first').css('display','block');
////           alert($('.test:first').html());
//            
//        });
	$('#begin_2').click(function(){
	 
	   $('.topbox').css('display','none'); 
		$('.test:first').css('display','block'); 
	});
	 
	$('li').click(function(){
		$(this).addClass('on');
//            alert(   $(this).html());
		var select=$(this).children(':radio').val();
		var answer=$(this).parents('div').children(':hidden').val();
//           s alert($(this).children(':radio').val());
		var sumScore=$('#sumScore').val();
		if(select===answer){
			$('#sumScore').val(parseInt(sumScore) 1);
		}
//            alert( $(this).parents('.test').css('display'));
		$(this).parents('div').css('display','none');
		if( $(this).parents('div').next('div').hasClass('end')){
		   var score= $('#sumScore').val();
		   if(score<5){
			   var src="img/score" score*5 ".png";
				 $('#level1 .score img').attr('src',src);
				$('#level1').css('display','block');
		   }else if(score<10){
				 var src="img/score" score*5 ".png";
				 $('#level2 .score img').attr('src',src);
				 $('#level2').css('display','block');
		   }else if(score<15){
				 var src="img/score" score*5 ".png";
				 $('#level3 .score img').attr('src',src);
				 $('#level3').css('display','block');
		   }else{ 
				 var src="img/score" score*5 ".png";
				 $('#level4 .score img').attr('src',src);
				 $('#level4').css('display','block');
		   }
		   document.title="我在测试中得到了" score*5 "分，你能超过我吗?";
		   $('.guanzhu1').css('display','block');
//               alert(document.title);
		   
		}else{
			   $(this).parents('div').next('div').css('display','block');
		}
//            alert( $(this).parents('div').next('div').html());
	});
	
 $(':radio').click(function(){
		 $(this).parents('li').addClass('on');
//             alert( $(this).parents('li').html());
		var select=$(this).val();
		var answer=$(this).parents('div').children(':hidden').val();
		var sumScore=$('#sumScore').val();
		if(select===answer){
			$('#sumScore').val(parseInt(sumScore) 1);
		}
//            alert( $(this).parents('.test').css('display'));
		$(this).parents('div').css('display','none');
		if( $(this).parents('div').next('div').hasClass('end')){
		   var score= $('#sumScore').val();
		   if(score<5){
			   var src="img/score" score*5 ".png";
				 $('#level1 .score img').attr('src',src);
				$('#level1').css('display','block');
		   }else if(score<10){
				 var src="img/score" score*5 ".png";
				 $('#level2 .score img').attr('src',src);
				 $('#level2').css('display','block');
		   }else if(score<15){
				 var src="img/score" score*5 ".png";
				 $('#level3 .score img').attr('src',src);
				 $('#level3').css('display','block');
		   }else{ 
				 var src="img/score" score*5 ".png";
				 $('#level4 .score img').attr('src',src);
				 $('#level4').css('display','block');
		   }
		   
		}else{
			   $(this).parents('div').next('div').css('display','block');
		}
//            alert( $(this).parents('div').next('div').html());
	});
//        $('.ask').click(function(){
//            $(this).parents('div').css('display','none');
//            $(this).parents('div').next('div').css('display','block');
//            var select=$(this).parents('div').find(':radio:checked').val();
//            alert(select);
//        });
	   
		function WeiXinShareBtn() {
		 if (typeof WeixinJSBridge == "undefined") {
				 alert("请先通过微信搜索考试招聘信息平台，通过微信分享文章 :) ");
		 } else {
		 WeixinJSBridge.invoke('shareTimeline', {
		 "title": "测试",
		 "link": "http://wx.linewow.com/ceshi/index.html",
		 "desc": "关注互联网创业",
		 "img_url": "http://wx.linewow.com/ceshi/img/topimg.jpg"
		 });
		 }
		 }
		  $('.share').click(function(){
//                WeiXinShareBtn();

		   $('.share_b').css('display','block');
			 location.href = "#title";
		});
		
		$('.share_b').click(function(){
			$(this).css('display','none');
		});
		$('#close').click(function(){
		   $('.guanzhu1').css('display','none');
		});
	
})
</script>      
       
<title>测试</title>

<link href="style.css" rel="stylesheet" type="text/css" />

</head>

<body>
 
<div class="topbox" id='title'>
	<img src="img/bj.jpg" class="bg"/>	
<!--	<div class="tb_txt1"><span id="ft">已有<em>20112</em>人参与考试</span></div>-->
	<div class="con">
		
		
		<a  id="begin_2" class="test_a"><img src="img/btn.png" alt=""/></a>
	</div>
</div>

<div class="gztt" id='notice'>
   
</div>

    
    <div class="test">
        <div class="score" ><img src="img/test_bg.png" alt=""  style="border:none;border-radius:0px;"/></div>
	<div class="test_con">
		<div class="item">
			<div class="tit"><span>1.</span>-- How is your sister?<br />
                    -- She is 20 years old.</div>
			<div class="item_con">
				<ul>
					<li>
						<input type="radio" name="test1" id="" class="rad" value='A' /><span>A</span> Right 
					</li>
					<li>
						<input type="radio" name="test1" id="" class="rad" value='B'/><span>B</span> Wrong 
					</li>
	
				</ul>
                            <input type="hidden" value="C">
			</div>
		</div>
	
	</div>
</div>
    <div class="test">
         <div class="score"  ><img src="img/test_bg.png" alt="" style="border:none;border-radius:0px;"/></div>
	<div class="test_con">
		<div class="item">
			<div class="tit"><span>2.</span>-- What do you think of your new job?<br />
                    -- I think it is very easy for me.</div>
			<div class="item_con">
				<ul>
					<li>
					<input type="radio" name="test1" id="" class="rad" value='A' /><span>A</span> Right 
					</li>
					<li>
						<input type="radio" name="test1" id="" class="rad" value='B'/><span>B</span> Wrong 
					</li>
				</ul>
                            <input type="hidden" value="A">
			</div>
		</div>
	
	</div>
</div>
    <div class="test">
         <div class="score"  ><img src="img/test_bg.png" alt="" style="border:none;border-radius:0px;"/></div>
	<div class="test_con">
		<div class="item">
			<div class="tit"><span>3.</span> -- What’s the weather like in Shanghai?<br />
  -- It’s warmer than it is in London.</div>
			<div class="item_con">
				<ul>
					<li>
						<input type="radio" name="test1" id="" class="rad" value='A' /><span>A</span> Right 
					</li>
					<li>
						<input type="radio" name="test1" id="" class="rad" value='B'/><span>B</span> Wrong 
					</li>
				</ul>
                            <input type="hidden" value="B">
			</div>
		</div>
	
	</div>
</div>
    <div class="test">
         <div class="score"  ><img src="img/test_bg.png" alt="" style="border:none;border-radius:0px;"/></div>
	<div class="test_con">
		<div class="item">
			<div class="tit"><span>4.</span>-- Excuse me, which way is to the supermarket, please?<br />
   -- It’s next to the bank.</div>
			<div class="item_con">
				<ul>
					<li>
							<input type="radio" name="test1" id="" class="rad" value='A' /><span>A</span> Right 
					</li>
					<li>
						<input type="radio" name="test1" id="" class="rad" value='B'/><span>B</span> Wrong 
					</li>
				</ul>
                            <input type="hidden" value="A">
			</div>
		</div>
	
	</div>
</div>
    <div class="test">
         <div class="score"  ><img src="img/test_bg.png" alt="" style="border:none;border-radius:0px;"/></div>
	<div class="test_con">
		<div class="item">
			<div class="tit"><span>5.</span>. -- Would you like some coffee?<br />
  -- Yes, please.</div>
			<div class="item_con">
				<ul>
					<li>
					<input type="radio" name="test1" id="" class="rad" value='A' /><span>A</span> Right 
					</li>
					<li>
						<input type="radio" name="test1" id="" class="rad" value='B'/><span>B</span> Wrong 
					</li>
				</ul>
                            <input type="hidden" value="D">
			</div>
		</div>
	
	</div>
</div>
    <div class="test">
         <div class="score"  ><img src="img/test_bg.png" alt="" style="border:none;border-radius:0px;"/></div>
        <div class="test_con">
		<div class="item">
			<div class="tit"><span>6.</span> -- What did they do there?<br />
   -- They are working in a bank.</div>
			<div class="item_con">
				<ul>
					<li>
					<input type="radio" name="test1" id="" class="rad" value='A' /><span>A</span> Right 
					</li>
					<li>
						<input type="radio" name="test1" id="" class="rad" value='B'/><span>B</span> Wrong 
					</li>
				</ul>
                            <input type="hidden" value="A">
			</div>
		</div>
	
	</div>
</div>
    <div class="test">
         <div class="score"  ><img src="img/test_bg.png" alt="" style="border:none;border-radius:0px;"/></div>
	<div class="test_con">
		<div class="item">
			<div class="tit"><span>7.</span> -- Are you free on Thursday?<br />
  -- No, I am busy on Thursday but I am free on Friday.</div>
			<div class="item_con">
				<ul>
					<li>
						<input type="radio" name="test1" id="" class="rad" value='A' /><span>A</span> Right 
					</li>
					<li>
						<input type="radio" name="test1" id="" class="rad" value='B'/><span>B</span> Wrong 
					</li>
				</ul>
                            <input type="hidden" value="A">
			</div>
		</div>
	
	</div>
</div>
    <div class="test">
         <div class="score" ><img src="img/test_bg.png" alt="" style="border:none;border-radius:0px;"/></div>
	<div class="test_con">
		<div class="item">
			<div class="tit"><span>8.</span> -- Who is she talking to?<br />
  -- She is talking to Mary.</div>
			<div class="item_con">
				<ul>
					<li>
						<input type="radio" name="test1" id="" class="rad" value='A' /><span>A</span> Right 
					</li>
					<li>
						<input type="radio" name="test1" id="" class="rad" value='B'/><span>B</span> Wrong 
					</li>
				</ul>
                            <input type="hidden" value="A">
			</div>
		</div>
	
	</div>
</div>
    <div class="test">
         <div class="score"  ><img src="img/test_bg.png" alt="" style="border:none;border-radius:0px;"/></div>
	<div class="test_con">
		<div class="item">
			<div class="tit"><span>9.</span> -- When does the gym close?<br />
  -- On Tuesday.</div>
			<div class="item_con">
				<ul>
					<li>
						<input type="radio" name="test1" id="" class="rad" value='A' /><span>A</span> Right 
					</li>
					<li>
						<input type="radio" name="test1" id="" class="rad" value='B'/><span>B</span> Wrong 
					</li>
				</ul>
                            <input type="hidden" value="C">
			</div>
		</div>
	
	</div>
</div>
    <div class="test">
         <div class="score"  ><img src="img/test_bg.png" alt="" style="border:none;border-radius:0px;"/></div>
	<div class="test_con">
		<div class="item">
			<div class="tit"><span>10.</span>-- How was your day yesterday?<br />
   -- I’ve got a bad cough.
</div>
			<div class="item_con">
				<ul>
					<li>
						<input type="radio" name="test1" id="" class="rad" value='A' /><span>A</span> Right 
					</li>
					<li>
						<input type="radio" name="test1" id="" class="rad" value='B'/><span>B</span> Wrong 
					</li>
				</ul>
                            <input type="hidden" value="A">
			</div>
		</div>
	
	</div>
</div>
  
    <div class="test">
         <div class="score" > <img src="img/test_bg.png" alt="" style="border:none;border-radius:0px;" /></div>
	<div class="test_con">
		<div class="item">
			<div class="tit"><span>11.</span>. -- How much does the flat cost a month?<br />
   -- It costs 400 pounds.
 </div>
			<div class="item_con">
				<ul>
					<li>
						<input type="radio" name="test1" id="" class="rad" value='A' /><span>A</span> Right 
					</li>
					<li>
						<input type="radio" name="test1" id="" class="rad" value='B'/><span>B</span> Wrong 
					</li>
				</ul>
                            <input type="hidden" value="A">
			</div>
		</div>
	
	</div>
</div>
          <div class="test">
               <div class="score" ><img src="img/test_bg.png" alt="" style="border:none;border-radius:0px;" /></div>
	<div class="test_con">
		<div class="item">
			<div class="tit"><span>12.</span>-- Could you show me the ticket, please?<br />
    -- Certainly. Here you are!
   </div>
			<div class="item_con">
				<ul>
					<li>
						<input type="radio" name="test1" id="" class="rad" value='A' /><span>A</span> Right 
					</li>
					<li>
						<input type="radio" name="test1" id="" class="rad" value='B'/><span>B</span> Wrong 
					</li>
				</ul>
                            <input type="hidden" value="A">
			</div>
		</div>
	
	</div>
</div>
    <div class="test">
         <div class="score"  ><img src="img/test_bg.png" alt="" style="border:none;border-radius:0px;"/></div>
	<div class="test_con">
		<div class="item">
			<div class="tit"><span>13.</span>-- What do you think of your new job?<br />
    -- I think it is very difficult.</div>
			<div class="item_con">
				<ul>
					<li>
						<input type="radio" name="test1" id="" class="rad" value='A' /><span>A</span> Right 
					</li>
					<li>
						<input type="radio" name="test1" id="" class="rad" value='B'/><span>B</span> Wrong 

					</li>
				</ul>
                            <input type="hidden" value="D">
			</div>
		</div>
	
	</div>
</div>
    <div class="test">
         <div class="score"  ><img src="img/test_bg.png" alt="" style="border:none;border-radius:0px;"/></div>
	<div class="test_con">
		<div class="item">
			<div class="tit"><span>14.</span> -- Would you like some tea?<br />
   -- No, thanks. </div>
			<div class="item_con">
				<ul>
					<li>
						<input type="radio" name="test1" id="" class="rad" value='A' /><span>A</span> Right 
					</li>
					<li>
						<input type="radio" name="test1" id="" class="rad" value='B'/><span>B</span> Wrong 
					</li>
				</ul>
                            <input type="hidden" value="C">
			</div>
		</div>
	
	</div>
</div>
    <div class="test">
         <div class="score"  ><img src="img/test_bg.png" alt="" style="border:none;border-radius:0px;"/></div>
	<div class="test_con">
		<div class="item">
			<div class="tit"><span>15.</span>-- How do they do?
    -- They work in a bank.</div>
			<div class="item_con">
				<ul>
					<li>
						<input type="radio" name="test1" id="" class="rad" value='A' /><span>A</span> Right 
					</li>
					<li>
						<input type="radio" name="test1" id="" class="rad" value='B'/><span>B</span> Wrong 
					</li>
				</ul>
                            <input type="hidden" value="A">
			</div>
		</div>
	
	</div>
</div>
    
 
<div class="test end" id='level1'>
     <div class="score" ><img src="" alt=""/></div>
	<div class="test_con">
		<div class="answer_con">
			<h1>你完了</h1>
			<p>
			<span>详细分析：</span><br/>
			我很遗憾的告诉你，在美国你是绝对看不懂西游记、红楼梦、水浒传和葫芦娃的，还能不能好好玩了，还能不能愉快的做题了，那么认真
			</p>
		</div>
		
	</div>
	<div class="share"><img src="img/share.png" alt="分享"/></div>
</div>
<div class="test end" id='level2'>
       <div class="score"><img src="" alt=""/></div>
	<div class="test_con">
		<div class="answer_con">
			<h1>别放弃治疗</h1>
			<p>
			<span>详细分析：</span><br/>
			刚好及格
			</p>
		</div>
		
	</div>
	<div class="share"><img src="img/share.png" alt="分享"/></div>
</div>
<div class="test end" id='level3'>
       <div class="score" ><img src="" alt=""/></div>
	<div class="test_con">
		<div class="answer_con">
			<h1>还不错</h1>
			<p>
			<span>详细分析：</span><br/>
			良好
			</p>
		</div>
		
	</div>
	<div class="share"><img src="img/share.png" alt="分享"/></div>
</div>
<div class="test end" id='level4' >
       <div class="score"><img src="" alt=""/></div>
	<div class="test_con">
		<div class="answer_con">
			<h1>prefect</h1>
			<p>
			<span>详细分析：</span><br/>
			优秀
			</p>
		</div>
		
	</div>
	<div class="share"><img src="img/share.png" alt="分享"/></div>
</div>
<div class="share_b"><img src="img/fx.png" alt=""/></div>

<!--<div class="guanzhu">
  
    <img src="img/ico_tc_bg.png" alt="关注"/>
   </div>-->
   <input type="hidden" name='sumScore' id='sumScore' value="0">
</body>
</html>