Jquery刷新页面背景图片随机变换的实现方法


Posted in Javascript onMarch 15, 2013

使用方法:下载jquery-1.9.1.js,然后设置CSS,图片文件放在images/new_feed/目录下,图片命名格式为bg_x.jpg,修改随机数产生范围

一、CSS代码

<style>
 body{
                padding:0;
                background-attachment: fixed;
                background-clip: border-box;
                background-color: #666666;
                background-origin: padding-box;
                background-position: center top;
                background-repeat: no-repeat;
                background-size: cover;
                width: 100%;
                background-image:url("");}
</style>

二、Jquery代码

<script type="text/javascript">
     $(document).ready(function(){
         var random_bg=Math.floor(Math.random()*6+1);
         var bg='url(images/new_feed/bg_'+random_bg+'.jpg)';
         $("body").css("background-image",bg);
});
</script>
Javascript 相关文章推荐
JS 日期验证正则附asp日期格式化函数
Sep 11 Javascript
jQuery 的全选(全非选)即取得被选中的值使用介绍
Nov 12 Javascript
jquery cookie的用法总结
Nov 18 Javascript
JavaScript实现多维数组的方法
Nov 20 Javascript
Jquery之Bind方法参数传递与接收的三种方法
Jun 24 Javascript
浅谈Cookie的生命周期问题
Aug 02 Javascript
轻松实现js选项卡切换效果
Sep 24 Javascript
jquery添加div实现消息聊天框
Feb 08 jQuery
ES6 class类链式继承,实例化及react super(props)原理详解
Feb 15 Javascript
javascript设计模式 ? 命令模式原理与用法实例分析
Apr 20 Javascript
js实现微信聊天效果
Aug 09 Javascript
js实现菜单跳转效果
Dec 11 Javascript
jQuery方法简洁实现隔行换色及toggleClass的使用
Mar 15 #Javascript
jquery使用ColorBox弹出图片组浏览层实例演示
Mar 14 #Javascript
JavaScript 函数replace深入了解
Mar 14 #Javascript
JS异常处理的一个想法(sofish)
Mar 14 #Javascript
JQuery 中几个类选择器的简单使用介绍
Mar 14 #Javascript
document.createElement()用法及注意事项(ff下不兼容)
Mar 13 #Javascript
document.createElement()用法
Mar 13 #Javascript
You might like
php类常量用法实例分析
2015/07/09 PHP
php单链表实现代码分享
2016/07/04 PHP
RR vs IO BO3 第二场2.13
2021/03/10 DOTA
慎用 somefunction.prototype 分析
2009/06/02 Javascript
Firefox中beforeunload事件的实现缺陷浅析
2012/05/03 Javascript
jquery插件制作 自增长输入框实现代码
2012/08/17 jQuery
Javascript实现返回上一页面并刷新的小例子
2013/12/11 Javascript
查找Oracle高消耗语句的方法
2014/03/22 Javascript
JavaScript静态类型检查工具FLOW简介
2015/01/06 Javascript
快速掌握WordPress中加载JavaScript脚本的方法
2015/12/17 Javascript
在AngularJS框架中处理数据建模的方式解析
2016/03/05 Javascript
深入理解JavaScript中的对象复制(Object Clone)
2016/05/18 Javascript
jQuery删除节点用法示例(remove方法)
2016/09/08 Javascript
jstree创建无限分级树的方法【基于ajax动态创建子节点】
2016/10/25 Javascript
socket.io学习教程之深入学习篇(三)
2017/04/29 Javascript
vue主动刷新页面及列表数据删除后的刷新实例
2018/09/16 Javascript
js字符串处理之绝妙的代码
2019/04/05 Javascript
Vue2.0实现组件之间数据交互和通信操作示例
2019/05/16 Javascript
vue + typescript + video.js实现 流媒体播放 视频监控功能
2019/07/07 Javascript
详解Python中的各种函数的使用
2015/05/24 Python
图文讲解选择排序算法的原理及在Python中的实现
2016/05/04 Python
遍历python字典几种方法总结(推荐)
2016/09/11 Python
python+selenium实现163邮箱自动登陆的方法
2017/12/31 Python
python计算两个矩形框重合百分比的实例
2018/11/07 Python
python爬虫开发之使用Python爬虫库requests多线程抓取猫眼电影TOP100实例
2020/03/10 Python
python将数据插入数据库的代码分享
2020/08/16 Python
python连接mysql数据库并读取数据的实现
2020/09/25 Python
Original Penguin英国官方网站:美国著名休闲时装品牌
2016/10/30 全球购物
意大利网上药房:Farmacia 33
2020/01/27 全球购物
写一个函数返回1+2+3+…+n的值(假定结果不会超过长整型变量的范围)
2014/09/05 面试题
国税会议欢迎词
2014/01/16 职场文书
债务纠纷委托书范本
2014/10/14 职场文书
房屋租赁协议书
2014/10/18 职场文书
OpenCV图像变换之傅里叶变换的一些应用
2021/07/26 Python
JavaScript模拟实现网易云轮播效果
2022/04/04 Javascript
sql查询语句之平均分、最高最低分及排序语句
2022/05/30 MySQL