废话不说直接放代码了：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"/> <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1.0" /> <title>title</title> <style> .max{width:auto;height:100%;position: fixed;background: rgb(0, 0, 0);margin:auto;left:0; right:0; top:0; bottom:0;z-index: 99;} .min{width:auto;height:200px;} .coverage{width:100%;height:100%;position: fixed;background: rgb(0, 0, 0);margin:auto;left:0; right:0; top:0; bottom:0;z-index: 98;opacity: 0.7;} </style> <script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script> <script type="text/javascript"> $(function(){ $('#imgUrl').click(function(){ console.log(123); $(this).toggleClass('max'); $(this).toggleClass('min'); $('#divImg').toggleClass('coverage'); }); }); </script> </head> <body> <div id="divImg"></div> <img id="imgUrl" name="imgUrl" alt="图片不存在" class="min" src="http://ubmcmm.baidustatic.com/media/v1/0f0005DvCD4iH17mKT7tys.jpg"> </body> </html>
浙公网安备 33010602011771号