jQuery仿qq投票统计动画效果

jQuery仿qq投票统计动画效果

添加时间:2021-03-22 08:15:23
站长推荐丨赞助论坛,可获取海量资源终身免费下载权限奥!
举报 举报
收藏
预览
附件 附件
  • 模板类型模板类型:柱状图
  • 模板颜色模板颜色:高级
  • 下载积分下载积分:28 米粒
  • 下载权限下载权限:

    赞助会员

支持自定义统计选项,jquery仿qq动画进度投票打分插件,可支持设置多个投票评论系统,而且支持投票评论打分,有flash动画进度条投票评论打分系统。
jQuery仿qq投票统计动画效果
分类:统计图 > 柱状图 难易:高级

生成2个投票区域和获取选中值

<div class="demo">
    <div id="poll_a"></div>
    <div id="poll_b"></div>
    <div class="btn"><input type="button" id="getPollData1" value="获得第一个投票的值"/></div>
    <div id="poll_c"></div>
    <div class="btn"><input type="button" id="getPollData2" value="获得第二个投票的值"/></div>
</div>

引入投票插件jQuery.spider.poll.js

<script type="text/javascript" src="js/jQuery.spider.poll.js"></script>
var data = "{root:[{id:'10000',name:'jquery图片特效',value:'50'},{id:'10001',name:'jquery导航菜单',value:'20'},{id:'10002',name:'jquery选项卡特效',value:'10'},{id:'10003',name:'jquery文字特效',value:'10'},{id:'10004',name:'jquery表单特效',value:'10'}]}";

var data1 = "{root:[{id:'10000',name:'js图片特效',value:'50'},{id:'10001',name:'js导航菜单',value:'20'},{id:'10002',name:'js选项卡特效',value:'10'},{id:'10003',name:'js文字特效',value:'10'},{id:'10004',name:'js表单特效',value:'10'}]}";

var data2 = "{root:[{id:'10000',name:'jquery特效',value:'60'},{id:'10001',name:'js特效',value:'40'}]}";

$(document).ready(function() {
    $("#poll_a").poll("poll1", {
        title: 'jquery特效',
        titleColor: '#ff6600',
        width: '600px',
        data: data
    });

    $("#poll_b").poll("poll2", {
        title: 'js特效',
        titleColor: '#ff0000',
        width: '600px',
        data: data1,
        showPoll: true,
        multiple: true
    });

    $("#poll_c").poll("poll3", {
        title: '前端脚本',
        titleColor: 'blue',
        width: '600px',
        data: data2,
        multiple: false
    });

    $("#getPollData1").click(function() {
        $("#poll_b").getChecked().each(function(i, n) {
            alert($(n).val());
        });
    });
    $("#getPollData2").click(function() {
        $("#poll_c").getChecked().each(function(i, n) {
            alert($(n).val());
        });
    });

});

jQuery.spider.poll.js投票相关API参数

参数 描述 默认值
title 上方的标题 -
titleColor 标题颜色 #C3C3C3
titleAlign 标题居中方式 center
width 投票区域总宽度 500px
speed 显示效果的时间(毫秒) 1000
bgImg 背景 images/bg.gif
multiple 是否多选 false
showPoll 是否显示投票 false
data 数据 -
itelTotal 一共支持的颜色数量 6
itemStyle 选项参数 { fontSize:'12px',//每条文字的大小 bgColor:'#fffae2'//每条的背景颜色 }
相关内容推荐
资源求助发帖
查看更多发帖

*

回帖描述:

*

链接类型:

*

下载链接:

密码:
发帖规则:回帖内容为会员之间的私信,普通网友无法查看。
免责声明:回帖中提供的链接内容仅供会员之间学习参考使用,获取内容后请在法律法规范围内使用。回帖提供的内容应符合法律法规要求,不得违反法律法律的要求。
站点权责:回帖内容如违反法律法规,站点有权封停账号使用权利。对用户举报的内容,站点有责任及时删除违规内容。
热点内容推荐
标题:jQuery仿qq投票统计动画效果

*

描述:
平均回复时间:3-10分钟
规则介绍:悬赏寻求论坛网友分享资源,站点对分享内容的准确性,合法性,版权等没有足够的监管能力。如果您发现资源不正确,无法使用,不符合法律法律等情况,您可以直接举报资源。站长将尽快核实您的举报,并根据情况,采取封号,退换米粒等处理。

*

回帖描述:

*

链接类型:

*

阅读权限:

*

下载链接:

密码:
发帖规则:回帖内容为会员之间的私信,普通网友无法查看。
免责声明:回帖中提供的链接内容仅供会员之间学习参考使用,获取内容后请在法律法规范围内使用。回帖提供的内容应符合法律法规要求,不得违反法律法律的要求。
站点权责:回帖内容如违反法律法规,站点有权封停账号使用权利。对用户举报的内容,站点有责任及时删除违规内容。
  • 背景波浪
  • 背景波浪
  • 波浪
  • 波浪
客服
在线咨询
周一 至 周日 9:00 ~ 22:00
QQ:1326974360
微信:juyoubuluo6688
客服热线
18205485173
工作日 9:00 ~ 18:00
微信扫码咨询
客户服务
欢迎咨询服务
咨询量较多时,请耐心等待
社群

关注公众号

获取更多资讯

扫码进群(QQ)

与更多大牛交流沟通

0.090317s