jQuery仿qq投票统计动画效果

jQuery仿qq投票统计动画效果

支持自定义统计选项,jquery仿qq动画进度投票打分插件,可支持设置多个投票评论系统,而且支持投票评论打分,有flash动画进度条投票评论打分系统。

淘建站为您提供更多_其它特效_统计图_统计_动画,在此特别感谢您对我们的支持与厚爱!

查看演示

演示不了,点击反馈

加入收藏

下载 406 次

打赏作者

觉得不错,可打赏下作者

下载资源

免费共享

特别说明:本站资源来自网友发布分享,仅供学习与参考,请勿用于商业用途,若有侵权请联系删除(272966172@qq.com)。
分类:统计图 > 柱状图 难易程度:高级

生成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'//每条的背景颜色 }

声明:本资料由淘建站会员提供,如转载注明来源,资料来源淘建站免费素材库:https://www.taojz.cn/texiao/778.html
jQuery仿qq投票统计动画效果 希望对你有帮助,感谢您的支持!
  • html5动漫风格的引导页加载动画特效

    html5动漫风格的引导页加载动画特效

  • jquery制作创建单页动画404页面

    jquery制作创建单页动画404页面

  • html5 svg适用于手机端播放器按钮动画特效

    html5 svg适用于手机端播放器按钮动画特效

  • jQuery纵向投票结果演示

    jQuery纵向投票结果演示

  • progressbar带动画效果的统计小插件

    progressbar带动画效果的统计小插件

  • PHP+jQuery+Ajax+Mysql实现文章心情投票功能

    PHP+jQuery+Ajax+Mysql实现文章心情投票功能

  • jQuery开启百宝箱摇头效果

    jQuery开启百宝箱摇头效果

  • jquery.easing动画插件

    jquery.easing动画插件

  • html5交互设计乐器演奏动画特效

    html5交互设计乐器演奏动画特效

  • 一张图片的动画效果的演示

    一张图片的动画效果的演示

  • 红星放金光动画

    红星放金光动画

  • html5鼠标悬停叠加图片弹性动画特效

    html5鼠标悬停叠加图片弹性动画特效

  • 留言(0)
    头像
     阿里云限量代金券,戳我领取
    1 2