灯泡点亮效果

news/2024/11/7 21:00:56/

在这里插入图片描述
首先打一个div在给他一个类,然后我就复制
两个在改一下里面的类名。
在这里插入图片描述
之后css放两张不同灯泡的图片和下面的那个
灯丙设置他的宽度和高度用绝对定位或者是
用外边距为auto,移动到中间的这个位置,
在中间的类名加一个鼠标移入指针就会变成
小手的设置,第三个是加一个display为none
(让此元素不会被显示)。
在这里插入图片描述
Css的部分写好了之后,在到源代码这里在前
面的三个类都打上id在写上相同的类名,就
到js里面写他的事件,首先输入一个页面加
载事件大括号包裹起来,再来在他里面的内容
打一个var声明一个类同样的在把他复制两
份更改一下类


http://www.ppmy.cn/news/833626.html

相关文章

##JavaScript灯泡开关

JavaScript–灯泡开关 这是点击后的效果(图片是自己P的&#xff0c;有点难看&#xff0c;不要见怪) 下面是代码展示&#xff1a; <!DOCTYPE html> <html><head><meta charset"utf-8"><title>灯泡开关</title><style>#d…

JAVAScript 灯泡(开关,图片转换)

方案一 单按钮&#xff08;开 / 关&#xff09; <!DOCTYPE html> <html lang"en"> <head> <meta charset"UTF-8"> <meta http-equiv"X-UA-Compatible" content"IEedge"> <meta name"viewp…

服务器电源维修接灯泡,维修串接灯泡电路图

电磁炉串接灯泡法维修好的正确方法分享给大家 1、首先将电磁炉的电源串联一个灯泡(150W-200W最好200W)不放锅开机200W灯泡不亮,自检通过。 然后将电磁炉火候调到小档位后再放锅灯泡有规律的一亮一暗(注意亮度很高,且能够正常工作,会有加热的声音),拿走锅,灯泡即灭不亮不闪…

灯光设计中筒灯与射灯的使用

​筒灯射灯是家居灯光设计中经常会使用到的灯具,合理的搭配能使居住环境焕然一新,而且近年来无主灯的设计逐渐成为家居照明设计的主流,追求没有主灯的灯光照明设计,筒灯射灯被使用的频率便更高了。 一、筒灯与射灯的区别 1、光源上的不同 其实单从造型来看,其实对于新手…

IIS实现http跳转https的重定向方法

整体流程为&#xff1a; 1、安装SSL证书&#xff1b;2、下载安装URL Rewrite模块&#xff1b;3、配置“URL重写”规则&#xff0c;或者修改web.config配置文件。 一、安装部署证书 首先安装SSL证书。 二、安装URL ReWrite扩展 URL ReWrite扩展下载地址https://www.iis.net/…

QML加载QIcon,或从主题及文件加载图标

文章目录 前言继承QQuickPaintedItem设置icon属性绘制图标注册到QML系统在QML中加载QIconImage模块使用QIconImage核心代码实现前言 最近使用QML加载QIcon 发现在QML中不能直接使用QIcon类,常见的比如在Button中设置icon属性为QIcon类会提示Unable to assign QIcon to QQuic…

得推二手商城系统类似咸鱼商城PHP商城系统源码 v1.2

内容目录 一、详细介绍二、效果展示1.部分代码2.效果图展示 三、学习资料下载 一、详细介绍 得推二手商城系统是一个类似于咸鱼商城的PHP商城系统源码&#xff0c;包含了商城&#xff0c;圈子&#xff0c;回收&#xff0c;金币兑换&#xff0c;签到等多个模块&#xff0c;可以…

SAP MM模块之货源清单(转载)

货源清单是SAP采购管理里面的主数据&#xff0c;来决定采购员下采购单时候&#xff0c;能够选择的货源。 正常来说&#xff0c;我们向供应商询价之后&#xff0c;供应商将在规定的时间内给我们报价&#xff0c;如果供应商的价格合适&#xff0c;我们将认可这个报价&#xff0c…