ajax异步请求获取数据,实现滚动数字的效果。
BackgroundPositionAnimate.js下载
需要导入的js:
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/BackgroundPositionAnimate.js"></script>
展示数字滚动效果的html元素:
<div>
下载量:<span class="t_num"></span>次
</div>
通过异步请求获取数据:
function getdata(){
$.ajax({
url: 'data.php',
type: 'POST',
dataType: "json",
cache: false,
timeout: 10000,
error: function(){},
success: function(data){
show_num(data.count);
}
});
}
//表示查询传递的数字
function show_num(n){
var it = $(".t_num i");
var len = String(n).length;
for(var i=0;i<len;i++){
if(it.length<=i){
$(".t_num").append("<i></i>");
}
var num=String(n).charAt(i);
var y = -parseInt(num)*30; //y轴位置
var obj = $(".t_num i").eq(i);
obj.animate({ //滚动动画
backgroundPosition :'(0 '+String(y)+'px)'
}, 'slow','swing',function(){}
);
}
}
设置定时:
$(function(){
getdata();
setInterval('getdata()', 3000);//每隔3秒执行一次
});
ajax异步请求获取数据,实现滚动数字的效果。的更多相关文章
- 16 react 发送异步请求获取数据 和 使用Redux-thunk中间件进行 ajax 请求发送
1.发送异步请求获取数据 1.引入 axios ( 使用 yarn add axios 进行安装 ) import axios from 'axios'; 2. 模拟 在元素完成挂载后加载数据 并初始 ...
- uni-app如何解决在for循环里调用异步请求获取数据顺序混乱问题?
总结/朱季谦 先前有一次做uni-app的js接口对接时,遇到过这样的情况,在for循环里,调用一个异步请求时,返回来的值顺序是乱的,因此,在以下的代码里,push到数组里的值,每次的顺序可能都是不一 ...
- scrapy爬虫之模拟ajax post请求获取数据
实质:分析真实请求地址,根据规则构造新地址从而获得数据. 分析发现数据是通过异步ajax方式→post 获得的 于是通过分析response ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ 发现每次翻页 网 ...
- Ajax异步请求PHP数据
来源:http://www.ido321.com/1138.html 接到了老师的一个作业,实现的布局如图: 如果输入了科室ID,科室名字只显示与ID对应的,若没有输入,则显示全部,然后根据I科室名字 ...
- 【Spring学习笔记-MVC-5】利用spring MVC框架,实现ajax异步请求以及json数据的返回
作者:ssslinppp 时间:2015年5月26日 15:32:51 1. 摘要 本文讲解如何利用spring MVC框架,实现ajax异步请求以及json数据的返回. Spring MV ...
- jQuery使用ajax跨域请求获取数据
jQuery使用ajax跨域请求获取数据 跨域是我在日常面试中经常会问到的问题,这词在前端界出现的频率不低,主要原因还是由于安全限制(同源策略, 即JavaScript或Cookie只能访问同域下的 ...
- jquery的ajax异步请求接收返回json数据
http://www.jb51.net/article/51122.htm jquery的ajax异步请求接收返回json数据方法设置简单,一个是服务器处理程序是返回json数据,另一种就是ajax发 ...
- ajax异步请求不能刷新数据的问题
搞了两三天的问题,今天解决了.总结下: function reportGrpChange(cuid, title){ document.getElementById('reportFrameDiv') ...
- 09.VUE学习之watch监听属性变化实现类百度搜索栏功能ajax异步请求数据,返回字符串
cmd下安装axios npm install axios 安装好后,会多出node_modules文件夹 思路: 监听data里的word改变时,发送ajax异步请求数据, 把返回的数据赋值给dat ...
随机推荐
- Tensorflow高效读取数据的方法
最新上传的mcnn中有完整的数据读写示例,可以参考. 关于Tensorflow读取数据,官网给出了三种方法: 供给数据(Feeding): 在TensorFlow程序运行的每一步, 让Python代码 ...
- RobotFrameWork+APPIUM实现对安卓APK的自动化测试----第七篇【元素定位介绍】
http://blog.csdn.net/deadgrape/article/details/50628113 我想大家在玩自动化的时候最关心的一定是如何定位元素,因为元素定位不到后面的什么方法都实现 ...
- CodeForcesGym 100676G Training Camp
G. Training Camp Time Limit: 1000ms Memory Limit: 262144KB This problem will be judged on CodeForces ...
- windows无法开机解决方法
电脑启动弹出错误Ntldr is missing , 解决方法:重新从xp中拷贝一个出来粘贴上就行 电脑启动弹出错误Ntldr is compressed ,表示分区中的文件被压缩了 解决方法:首先把 ...
- nodejs-函数
使用表达式定义的函数要提到使用之前,要不然无法解析,自然的function xx(xx)不用,ECMAscript自动提前 with关键字 引入空间命令空间,然后可以直接使用里面的对象了 label标 ...
- Toast分析——实现自己的Toast
android 4.0以后,新增了一个功能:关闭某个应用发出的通知.Toast等.详细操作为:打开应用安装列表.找到要屏蔽的应用(长按通知,点击弹出的"应用信息",就可以跳到应用信 ...
- hdu2476String painter (区间DP)
Problem Description There are two strings A and B with equal length. Both strings are made up of low ...
- File and Folder Permissions
https://msdn.microsoft.com/en-us/library/bb727008.aspx On NTFS volumes, you can set security permiss ...
- svn插件失效
安装其他插件后,可能出现SVN插件失效了,在eclipse中完全找不到SVN的任何操作选项,此时可尝试通过以下办法解决: 把eclipse/configuration目录下的org.eclipse.u ...
- 基本类型转换成NSNumber类型
int i=100; float f=2.34; NSNumber *n1=[NSNumber numberWithInt:i]; NSNumber *n2=[NSNumber numberWithF ...