基于js实现投票的实例代码

本文实例讲述了Javascript实现三种投票方式的实现方法，分享给大家供大家参考。具体如下：

一、js柱状投票图
效果图：

实现代码：

body { font-weight:bold; color:#fff; font-size:16px; font-family:Arial, Helvetica, sans-serif; background-color:#000000;}

.zhu { margin-top:100px; width:420px; position:relative;}
.good { width:200px; position:absolute; bottom:0; left:0; text-align:center; background-color:#f00; height:50px;}
.bad { width:200px;position:absolute; bottom:0; right:0; text-align:center; background-color:#009900; height:50px;}
.and {}









好评50%
差评50%

总数为0票

二、JS投票
效果图：

实现代码：

 

 
 
 
 
 
 
  .voteresult{
 margin: 2px;
 margin-top: 5px;
 display: block;
 float: left;
 width: 250px;
 height: 10px;
 background-color: #EEE;
 overflow: hidden;
 }
 .style3{
 background-color: #666666;
 }
 
 
 
 
 你喜欢的运动：
 

 篮球  足球  乒乓球 
  

 
 

 

 

 

 
投票结果
 
 

 
篮球
 

 
0%

 
 

 
足球
 

 
0%

 
 

 
乒乓球
 

 
0%

 

 

三、投票
效果图：

实现代码：

body{ font-size:12px;}





 

  
0
 
 

  
投一票
 

以上就是本文的全部内容，希望对大家的学习有所帮助。