点击按钮时div显示再次点击时隐藏（白天夜间切换）

左手的ㄟ右手 2022-10-02 00:46 199阅读 0赞

## ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwMDcyNTgz_size_16_color_FFFFFF_t_70] ##

### position: fixed; 生成绝对定位的元素，相对于浏览器窗口进行定位 ###

### opacity: 0.6; 设置透明度 ###

### outline: 1000px solid rgba(0, 0, 0, 0.3); 设置轮廓大小及颜色 0.3为透明度值 ###

### z-index: 999999;将div在顶层显示 ###

### 效果图：![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwMDcyNTgz_size_16_color_FFFFFF_t_70 1] ###

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwMDcyNTgz_size_16_color_FFFFFF_t_70 2]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwMDcyNTgz_size_16_color_FFFFFF_t_70]: /images/20220113/29ecd79c0ee34c829580f9c1767c2f41.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwMDcyNTgz_size_16_color_FFFFFF_t_70 1]: /images/20220113/216e588433464bd090c1799dd21da2dc.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwMDcyNTgz_size_16_color_FFFFFF_t_70 2]: /images/20220113/5bb2909b6eb04d75b5c6e18173de4eff.png

发表评论取消回复

表情：

评论列表（有 0 条评论，199人围观）

还没有评论，来说两句吧...

相关阅读

相关点击按钮时div显示再次点击时隐藏（白天夜间切换）

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4u

左手的ㄟ右手/ 2022年10月02日 00:46/ 0 赞/ 200 阅读

相关 js控制div点击隐藏显示

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta n

比眉伴天荒/ 2022年09月26日 15:49/ 0 赞/ 239 阅读

相关点击显示再次点击隐藏

<script> $(function()\{ $('\a').click(function()\{//点击a标签 if($('

亦凉/ 2022年06月07日 09:06/ 0 赞/ 316 阅读

相关 jquery 点击按钮，再显示4张图片，再次点击，再次显示4张图片

这里的图片用内容表示，可以自行换乘图片主要看方法。 <!DOCTYPE html> <html lang="en"> <head>

雨点打透心脏的1/2处/ 2022年06月05日 12:38/ 0 赞/ 245 阅读

相关点击其他区域时隐藏元素

效果说明，除了当前区域外，点击其他任何地方，都会让当前元素区域隐藏。思路很简单，点击整个document,让它隐藏，一层一层向上冒泡，当点击隐藏接触到当前区域时，也就是你不

不念不忘少年蓝@/ 2022年06月05日 01:26/ 0 赞/ 213 阅读

相关点击一个按钮显示div，点击div之外的地方div隐藏，点击div之内的地方div不隐藏

<input id="btnClick" type="button" value="原生写法" class="btn-green radius" />

一时失言乱红尘/ 2022年05月23日 13:53/ 0 赞/ 255 阅读

相关点击一个按钮隐藏和显示div

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>点击一个按钮隐藏

一时失言乱红尘/ 2022年05月09日 06:56/ 0 赞/ 256 阅读

相关 js/jq 点击按钮显示div,点击页面其他任何地方隐藏div

1. JS效果 <!DOCTYPE html> <html> <head> <meta http-equiv="Content

深碍√TFBOYSˉ_/ 2022年04月18日 06:32/ 0 赞/ 293 阅读

相关点击切换div 的隐藏与显示

点击切换div 的隐藏与显示适合做切换按钮 <!DOCTYPE html> <html> <head> <me

末蓝、/ 2022年01月29日 12:55/ 0 赞/ 359 阅读

相关点击一个按钮显示div，点击div之外的地方div隐藏，点击div之内的地方div不隐藏

<input id="btnClick" type="button" value="原生写法" class="btn-green radius" />

蔚落/ 2022年01月29日 09:35/ 0 赞/ 343 阅读