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 相关文章推荐
用Jquery实现可编辑表格并用AJAX提交到服务器修改数据
Dec 27 Javascript
javascript让setInteval里的函数参数中的this指向特定的对象
Jan 31 Javascript
jquery 学习之二 属性(html()与html(val))
Nov 25 Javascript
javascript中Number对象的toString()方法分析
Dec 20 Javascript
jQuery提示插件qTip2用法分析(支持ajax及多种样式)
Jun 08 Javascript
Angular.js与node.js项目里用cookie校验账户登录详解
Feb 22 Javascript
js仿网易表单及时验证功能
Mar 07 Javascript
Vue中的无限加载vue-infinite-loading的方法
Apr 08 Javascript
新手必须知的Node.js 4个JavaScript基本概念
Sep 16 Javascript
实例介绍JavaScript中多种组合继承
Jan 20 Javascript
js实现树形数据转成扁平数据的方法示例
Feb 27 Javascript
JavaScript中变量提升和函数提升的详解
Aug 07 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
phpMyAdmin 安装配置方法和问题解决
2009/06/08 PHP
php cookie 详解使用实例
2016/11/03 PHP
解决Yii2邮件发送结果返回成功,但接收不到邮件的问题
2017/05/23 PHP
PHP手机号中间四位用星号*代替显示的实例
2017/06/02 PHP
PHP编译configure时常见错误的总结
2017/08/17 PHP
Thinkphp5.0框架视图view的循环标签用法示例
2019/10/12 PHP
让IE8支持DOM 2(不用框架!)
2009/12/31 Javascript
关于IE BUG与字符串截取substr的解决办法
2013/04/10 Javascript
JQueryiframe页面操作父页面中的元素与方法(实例讲解)
2013/11/19 Javascript
Javascript 读取操作Sql中的Xml字段
2014/10/09 Javascript
JavaScript中的异常捕捉介绍
2014/12/31 Javascript
JS+CSS模拟可以无刷新显示内容的留言板实例
2015/03/03 Javascript
RGB和YUV 多媒体编程基础详细介绍
2016/11/04 Javascript
微信小程序使用navigateTo数据传递的实例
2017/09/26 Javascript
基于twbsPagination.js分页插件使用心得(分享)
2017/10/21 Javascript
JS函数节流和函数防抖问题分析
2017/12/18 Javascript
vue组件实现进度条效果
2018/06/06 Javascript
JavaScript设计模式之构造器模式(生成器模式)定义与用法实例分析
2018/07/26 Javascript
vue devtools的安装与使用教程
2018/08/08 Javascript
在create-react-app中使用sass的方法示例
2018/10/01 Javascript
JavaScript实现表单验证功能
2020/12/09 Javascript
[44:39]2014 DOTA2国际邀请赛中国区预选赛 NE VS CNB
2014/05/21 DOTA
python中将阿拉伯数字转换成中文的实现代码
2011/05/19 Python
Python使用numpy实现BP神经网络
2018/03/10 Python
Tensorflow中使用tfrecord方式读取数据的方法
2018/06/19 Python
python gensim使用word2vec词向量处理中文语料的方法
2019/07/05 Python
pandas apply使用多列计算生成新的列实现示例
2021/02/24 Python
HTML5之SVG 2D入门1—SVG(可缩放矢量图形)概述
2013/01/30 HTML / CSS
世界上最大的高分辨率在线图片库:Alamy
2018/07/07 全球购物
美国最大的船只买卖在线市场:Boat Trader
2018/08/04 全球购物
开学寄语大全
2014/04/08 职场文书
村党的群众路线教育实践活动工作总结
2014/10/25 职场文书
习近平在党的群众路线教育实践活动总结大会上的讲话全文
2014/10/25 职场文书
助学感谢信范文
2015/01/21 职场文书
2016自主招生教师推荐信范文
2015/03/23 职场文书
导游词之无锡唐城
2019/12/12 职场文书