换肤效果

标签: js  

<body>
    <style>
        body{
          background: url(images/1.jpg) no-repeat center top; position: relative;
        }
        .box{ display:flex;
       justify-content:center;
       align-items:center;background: #ffff; padding: 10px;}
        .box ul li{ float: left; width:200px;}
       </style>
    <div class="box">
         <ul>
             <li><img src="images/1.jpg"></li>
             <li><img src="images/2.jpg"></li>
             <li><img src="images/3.jpg"></li>
         </ul>
    </div>
    <script>
        var imgs=document.querySelectorAll('.box li img')
           for(var i=0;i<imgs.length; i++){
               imgs[i].onclick=function(){
                   document.body.style.background='url('+this.src+')'
               }
           }
    </script>
</body>

在这里插入图片描述

版权声明:本文为sinat_35539553原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/sinat_35539553/article/details/106994470

智能推荐

vue中实现换肤效果,运用less很简单

demo:      实现流程:基于给页面最外侧标签设置class类名,来改变,通过函数参数的传递实现,多定义类名,赋值给需要的标签 1、vue-cli安装 less 2、新建common.less @background等是变量,可以通过函数传递来改变 3、新建color.less...

css3画圆和椭圆

试一下就知道怎么用了,  画个多来A梦 是用多简单...

raw&assets&sdcard读取mp3文件的方式

Raw方式 assets SDcard 首先需要添加 静态请求权限 动态请求 playMnt的播放方法 如何在模拟器中添加音乐 详细代码参见 点击跳转...

微信小程序封装请求方法wx.request(OBJECT)

小程序写完也一段时间了,最近分享下装逼的技能吧,封装请求方法,不但高大上,而且使用简单。先说说小程序自带的请求吧! wx.request(OBJECT) 参数: 参数名 类型 必填 默认值 说明 url String 是 开发者服务器接口地址 data Object/String/ArrayBuffer 否 请求的参数 header Object 否 设置请求的 header,header 中不能...

猜你喜欢

【并行计算-CUDA开发】【视频开发】ffmpeg Nvidia硬件加速总结

2017年5月25日 0. 概述 FFmpeg可通过Nvidia的GPU进行加速,其中高层接口是通过Video Codec SDK来实现GPU资源的调用。Video Codec SDK包含完整的的高性能工具、源码及文档,支持,可以运行在Windows和Linux系统之上。从软件上来说,SDK包含两类硬件加速接口,用于编码加速的NVENCODE API和用于解码加速的NVDECODE API(之前被...

HTML简介及部分常用标签

一、HTML简介 1)HTML简介 HTML是⽤于创建⽹⻚的语⾔。我们通过使⽤HTML标记标签创建html⽂档来创建⽹⻚。 HTML代表超⽂ 本标记语⾔。 HTML是⼀种标记语⾔,它具有标记标签的集合。 HTML标签是由尖括号括起来的词,如 , 。标签通常成对出现,例如 和 。 ⼀对中的第⼀个标签是开始标签;第⼆个标签是结束标签。在上⾯的示例中, 是开始标签,⽽ 是结束标签。 我们还可以将开始标签...

05:最大值和最小值的差

原题链接 总时间限制:  1000ms  内存限制:  65536kB 描述 输出一个整数序列中最大的数和最小的数的差。 输入 第一行为M,表示整数个数,整数个数不会大于10000; 第二行为M个整数,以空格隔开,每个整数的绝对值不会大于10000。 输出 输出M个数中最大值和最小值的差。 样例输入 样例输出 源码...

java判断奇偶数注意点

如果让我们用java写一个方法来判断一个整数是奇数还是偶数,相信很多人很快能写出来,而其中可能就会有下面这种: 这样写有没有什么问题呢? 初步看,没什么问题,不过,真没问题吗?输入-1试试看: 结果为false诶,难道-1不是奇数?赶紧换成-3在试试,结果还是false。 究竟发生了什么,我们看看-1和-3分别与2求余是什么结果: 结果都是-1,这就要引出java的一个特性了,java求余结果与左...

mac终端使用ssh连接虚拟机(也就是连接远程服务器)

配置host 我们可以借助第三方工具SwitchHosts;SwitchHosts是开源的,可免费下载 本机ip地址是常开状态,我们公司还有一个预发布环境的host需要配置,跟本地配置host是一样的,只是ip不一样。 本地配置host如下图: ssh连接虚拟机 mac终端自带ssh,不需要我们下载任何东西 ps:虚拟机的账号和密码需要公司给你开 直接上命令 这样就连上你的虚拟机了,如下图所示: ...