html5实现点击弹出图片功能


Posted in HTML / CSS onJuly 16, 2021

下面给大家分享html5点击弹出图片,分为前台代码和js代码,具体内容如下所示:

前台代码:

<a href="javascript:;" onclick="repeat()">
 
<div id="modal_volume" style="position: fixed; text-align: center; width: 100%; height: 100%; top: 0; z-index: 9999; display: none;">
        <table style="width: 100%; height: 100%;">
            <tr>
                <td align="center" style="">
                    <div style="width: 900px; position: relative">
                        <a href="zjb_enroll?course=专业课提高班">
                           <img src="Content/images/tanchuang.jpg" /></a>
                        <a href="javascript:$('#modal_volume').fadeOut();" style="display: block; width: 45px; height: 45px; position: absolute; right: 11px; top: 10px; z-index: 2"></a>
                    </div>
                </td>
            </tr>
        </table>
</div>

js代码

<script>
        function repeat() {
            $('#modal_volume').fadeIn();
        }
    </script>

到此这篇关于html5实现点击弹出图片功能的文章就介绍到这了,更多相关html5点击弹出图片内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章,希望大家以后多多支持三水点靠木!

 
HTML / CSS 相关文章推荐
css动画效果之animation的常用样式
Mar 09 HTML / CSS
css3实现信纸/同学录效果的示例代码
Dec 11 HTML / CSS
CSS3 简单又实用的5个属性
Mar 04 HTML / CSS
css3选择器基本介绍
Dec 15 HTML / CSS
CSS3中颜色线性渐变实战
Jul 18 HTML / CSS
CSS3 实现弹跳的小球动画
Oct 26 HTML / CSS
css3中仿放大镜效果的几种方式原理解析
Dec 03 HTML / CSS
使用HTML5捕捉音频与视频信息概述及实例
Aug 22 HTML / CSS
html5 css3网站菜单实现代码
Dec 23 HTML / CSS
Html5 audio标签样式的修改
Jan 28 HTML / CSS
html5组织内容_动力节点Java学院整理
Jul 10 HTML / CSS
手摸手教你用canvas实现给图片添加平铺水印的实现
Aug 20 HTML / CSS
纯CSS3实现div按照顺序出入效果
CSS3中Animation实现简单的手指点击动画的示例
详解CSS中的特指度和层叠问题
Jul 15 #HTML / CSS
html form表单基础入门案例讲解
html+css实现环绕倒影加载特效
html5表单的required属性使用
Jul 07 #HTML / CSS
html输入两个数实现加减乘除功能
Jul 01 #HTML / CSS
You might like
11个PHPer必须要了解的编程规范
2014/09/22 PHP
PHP实现抽奖功能实例代码
2020/06/30 PHP
jquery动画1.加载指示器
2012/08/24 Javascript
jQuery在ul中显示某个li索引号的方法
2015/03/17 Javascript
js创建数组的简单方法
2016/07/27 Javascript
js点击按钮实现水波纹效果代码(CSS3和Canves)
2016/09/15 Javascript
JQuery中解决重复动画的方法
2016/10/17 Javascript
实例教学如何写vue插件
2017/11/30 Javascript
原生JS实现列表内容自动向上滚动效果
2019/05/22 Javascript
vue  elementUI 表单嵌套验证的实例代码
2019/11/06 Javascript
js实现单元格拖拽效果
2020/02/10 Javascript
vue中destroyed方法的使用说明
2020/07/21 Javascript
在Vue中使用CSS3实现内容无缝滚动的示例代码
2020/11/27 Vue.js
[37:35]DOTA2上海特级锦标赛A组资格赛#1 Secret VS MVP.Phx第二局
2016/02/25 DOTA
[13:55]Newbee vs Team Spirit
2018/06/07 DOTA
python实现桌面气泡提示功能
2019/07/29 Python
python并发编程多进程 互斥锁原理解析
2019/08/20 Python
FFrpc python客户端lib使用解析
2019/08/24 Python
Linux下通过python获取本机ip方法示例
2019/09/06 Python
Pytorch实现神经网络的分类方式
2020/01/08 Python
在Python 的线程中运行协程的方法
2020/02/24 Python
python 读取串口数据的示例
2020/11/09 Python
css3 border-radius属性详解
2017/07/05 HTML / CSS
前端canvas水印快速制作(附完整代码)
2019/09/19 HTML / CSS
Sasa莎莎海外旗舰店:香港莎莎美妆平台
2018/03/21 全球购物
植村秀加拿大官网:Shu Uemura加拿大
2019/09/03 全球购物
DOUGLAS波兰:在线销售香水和化妆品
2020/07/05 全球购物
如何理解transaction事务的概念
2015/05/27 面试题
公司庆典活动邀请函
2014/01/09 职场文书
老公给老婆的道歉信
2014/01/10 职场文书
2014党委书记四风问题对照检查材料思想汇报
2014/09/22 职场文书
检讨书范文大全
2015/05/07 职场文书
《鸡兔同笼》教学反思
2016/02/19 职场文书
Python实现简单的猜单词
2021/06/15 Python
使用Djongo模块在Django中使用MongoDB数据库
2021/06/20 Python
php实现自动生成验证码的实例讲解
2021/11/17 PHP