设为首页收藏本站

安徽论坛

 找回密码
 立即注册

QQ登录

只需一步,快速开始

查看: 4415|回复: 0

html5实现点击弹出图片功能

[复制链接]

83

主题

0

回帖

261

积分

中级会员

Rank: 3Rank: 3

积分
261
发表于 2022-3-26 11:02:00 | 显示全部楼层 |阅读模式 来自 中国江西南昌
下面给大家分享html5点击弹出图片,分为前台代码和js代码,具体内容如下所示:
前台代码:
  1. <a href="javascript:;" onclick="repeat()">

  2. <div id="modal_volume" style="position: fixed; text-align: center; width: 100%; height: 100%; top: 0; z-index: 9999; display: none;">
  3.         <table style="width: 100%; height: 100%;">
  4.             <tr>
  5.                 <td align="center" style="">
  6.                     <div style="width: 900px; position: relative">
  7.                         <a href="zjb_enroll?course=专业课提高班">
  8.                            <img src="Content/images/tanchuang.jpg" /></a>
  9.                         <a href="javascript:$('#modal_volume').fadeOut();" style="display: block; width: 45px; height: 45px; position: absolute; right: 11px; top: 10px; z-index: 2"></a>
  10.                     </div>
  11.                 </td>
  12.             </tr>
  13.         </table>
  14. </div>
复制代码
js代码
  1.   <script>
  2.         function repeat() {
  3.             $('#modal_volume').fadeIn();
  4.         }
  5.     </script>
复制代码
到此这篇关于html5实现点击弹出图片功能的文章就介绍到这了,更多相关html5点击弹出图片内容请搜索脚本之家以前的文章或继续浏览下面的相关文章,希望大家以后多多支持脚本之家!
                                                                                               
免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!
懒得打字嘛,点击右侧快捷回复 【右侧内容,后台自定义】
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

快速回复 返回顶部 返回列表