网页背景随机更换 | 沧水的博客

网页背景图片(自适应+固定+随机)
花了点时间找代码七凑八凑搞出来的小玩意...


(毕竟人家是业余的............)

〣( ºΔº )〣

这个是xy都自适应(也就是说一旦浏览器窗口尺寸发生变化变化图片就会变形)

<script type="text/javascript">
 //<!CDATA[
 var bodyBgs = [];
 bodyBgs[0] = "001.jpg";
 bodyBgs[1] = "002.jpg";
 bodyBgs[2] = "003.jpg";
 bodyBgs[3] = "004.jpg";
 bodyBgs[4] = "005.jpg";
 var randomBgIndex = Math.round( Math.random() * 4 );
 //输出随机的背景图
 document.write('<style>body{background:url(' + bodyBgs[randomBgIndex] + ') no-repeat 50% 0;background-attachment:fixed;background-size:100% 100%}</style>');
 //]]>                                                              定义图片位于x轴中间 、、定义图片不随滚动轴移动 、、定义图片占满屏幕x与y轴
</script>

 

这个是只自适应x轴,当变成手机浏览时就是y轴平铺图片

<script type="text/javascript">
 //<!CDATA[
 var bodyBgs = [];
 bodyBgs[0] = "/001.jpg";
 bodyBgs[1] = "/002.jpg";
 bodyBgs[2] = "/003.jpg";
 bodyBgs[3] = "/004.jpg";
 bodyBgs[4] = "/005.jpg";
 bodyBgs[0] = "/006.jpg";
 var randomBgIndex = Math.round( Math.random() * 5 );
 //输出随机的背景图
 document.write('<style>body{background:url(' + bodyBgs[randomBgIndex] + ') no-repeat 50% 0;background-attachment:fixed;background-size:100%;background-repeat:repeat-y;}</style>');
 //]]> 定义图片位于x轴中间、 、定义图片不随滚动轴移动 、、定义图片占满屏幕x轴、、定义y轴横向平铺
</script>

顺便一提:
修改主题目录index.php   就是修改首页
                         single.php  就是修改文章页面
                         page.php    就是修改页面页面

这篇文章还没有人发言,快抢第一!

发表评论



Copyright 2017 沧水的博客. All Rights Reserved.
湘ICP备17021400号-1托管于腾讯云中国律法保护