关于a标签的href属性的注意事项

今天在做一个lightbox效果的时候出现了一个问题。

当往下滚动再点击按钮出现lightbox的时候,lightbox的遮罩层不能铺满(即滚动高度处不能铺上),如下图所示。原因是提交按钮使用的是a标签,当给a标签写上href属性的时候,在每次点击都会自动跳到页面的最顶端,但是每次的点击行为发生的顺序是先在当前屏幕铺满灰色遮罩层然后再跳到页面顶端。故出现如下图的现象。

解决方法是:不要给a标签写上href属性或者这样写:href="javascript:void(0)"

另外需要注意的是,在IE中如果a标签不作为跳转按钮,则应加上属性防止跳转:target="_self"

 

转载于:https://www.cnblogs.com/joyho/articles/3370938.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/248354.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

在mac上安装gitlab

参考链接: https://www.cnblogs.com/floodwater/p/10138265.html 注意事项: 在安装gitlab-ce时,配置hostname域名后,通过域名访问gitlab时,需要配置本机hosts文件,不然不能访问 本地hosts文件中配置后 就可…

d3.js 入门指南

说到数据可视化,我们会行到很多优秀的框架,像echarts、highcharts,这些框架很优雅,健壮,能满足我们对可视化的大部分需求,但是缺点也很明显,就是这些框架几乎是不可定制化的,当遇到特…

Kubernetes系列之Helm介绍篇

本次系列使用的所需部署包版本都使用的目前最新的或最新稳定版,安装包地址请到公众号内回复【K8s实战】获取 介绍 Helm 是 Deis 开发的一个用于 Kubernetes 应用的包管理工具,主要用来管理 Charts。有点类似于 Ubuntu 中的 APT 或 CentOS 中的 YUM。Helm…

HTNL笔记整合

简述概括了HTML 的部分内容,不是很完善,希望能给予你们相对的帮助。 一下文件的整合百度云链接:HTML整合笔记 第一章 HTML入门 课时1:HTML初识 1、英文名(Hyper Text Markup Language)超文本标签语言 对…

EXCEL 图表 只在拐点的时候显示数字

EXCEL图表只在折线的拐点显示数值,中间不需要显示。同时往下拐的,显示在上方,往上的显示在下方,这样数值不会挡住线。 首先,做一些模拟数据 因为起点和终点数值必须显示,所以单元格,C2 D2 C19 D…

SQL语法(1、安装操作)

1、数据库的系统概述及安装与基本使用 bilibili可查找安装视频百度了解一下 – 使用超级管理员登录 CONN sys/change_on_install AS SYSDBA ; – 创建c##scott用户 CREATE USER c##scott IDENTIFIED BY tiger ; – 为用户授权 GRANT CONNECT,RESOURCE,UNLIMITED TABLESPACE…

第22章:MongoDB-聚合操作--聚合管道--$out

①$out$out:利用此操作可以将查询结果输出到指定的集合里面。②范例:将投影的结果输出到集合里③④⑤⑥⑦⑧⑨⑩⑪⑫⑬⑭⑮⑯⑰⑱⑲⑳转载于:https://www.cnblogs.com/Lucky-stars/p/10555296.html

SQL简单查询

1、简单查询 使用Oracle sql developer使用前,必须开启的服务: 查询emp表上的数据: select * from emp; Null为空,空不代表等于没有,null!0. 重新连接后,注意大小写及空格位! 简…

SQL限定查询

1、限定查询与排序显示 1.1限定查询的认识: 列:表中有大数据的信息,对数据进行筛选,查询到自己想要的信息。 (数据过多显示过慢,或者死机,在已有的样本数据库容器CDB转换为PDB之中)…

浅谈五大Python Web框架

http://www.csdn.net/article/2011-02-17/292058 导读:作者飞龙写了一篇《浅谈Python Web框架》,文中他介绍了几个Python Web框架和自己对选择框架的分析。在他看来,用Django来快速开发一些Web运用是很不错的选择。以下是文章内容&#xff1a…

主流浏览器和内核及Web标准

目前网络市场的浏览器主流: 课时3:web标准 WEB标准 w3c 万维网联盟组织,制定web标准的机构。 网页主要由三部分组成: 结构(Structure)、 表现(Presentation) 行为(Beh…

机器学习中的损失函数 (着重比较:hinge loss vs softmax loss)

https://blog.csdn.net/u010976453/article/details/78488279 1. 损失函数 损失函数(Loss function)是用来估量你模型的预测值 f(x)f(x) 与真实值 YY 的不一致程度,它是一个非负实值函数,通常用 L(Y,f(x))L(Y,f(x)) 来表示。损失函…

HTML入门第一和第二章

课时4:HTML初识 1、英文名(Hyper Text Markup Language)超文本标签语言 对网页上的内容进行描述 课时5:HTML骨架 课时6:我的第一个页面及其标签简介 课时7:骨架记忆法 课时8:什么是标签及其分…

H5第一天

移动Web - 基础&流式布局 目标 了解移动端主要浏览器的内核掌握用谷歌浏览器调试移动端页面(重要)了解布局视口、视觉视口、理想视口使用mate标签设置理想视口(重要)了解视网膜屏、物理像素、二倍图会使用background-size设…

boost::timer demo

#include <iostream> #include <boost/timer.hpp> //timer的头文件 using namespace boost; //打开boost名字空间int main(int argc, char** argv) {timer t; //定义一个计时器对象,并开始计时/*可度量的最大时间,以小时为单位*/std::cout << "max …

H5的第二天

移动web开发——flex布局 目标 了解flex布局的优缺点及原理能够说出flex布局原理、使用语法、特点&#xff08;重点&#xff09;能够使用flex布局常用属性&#xff08;重点&#xff09;能够独立完成携程移动端首页 1.0 传统布局和flex布局对比 1.1传统布局 兼容性好布局繁…

d3.js 入门指南 - 仪表盘

D3的全称是Data-Driven Documents&#xff08;数据驱动的文档&#xff09;&#xff0c;是一个用来做数据可视化的JavaScript函数库&#xff0c;而JavaScript文件的后缀通常为.js&#xff0c;所以D3被称为D3.js。 d3.js可以定制出各种图形&#xff0c;今天来用d3.js制作一个简易…

[转帖]华为的“大海思”与“小海思”

华为的“大海思”与“小海思” https://www.cnbeta.com/articles/tech/828275.htm没先到华为海思这么狠.. 作为华为的全资子公司&#xff0c;说起海思半导体&#xff0c;大家可能第一时间会想起麒麟处理器。经过多年的持续的研发投入&#xff0c;华为海思自研的麒麟处理器现在确…

H5第三天(1)

响应式布局 ☞核心知识点 less媒体查询 学习目标 掌握less基本语法能够使用less编写css代码能够掌握媒体查询能够使用媒体查询实现响应式布局 Less介绍 维护CSS的弊端 CSS本质上不是一门语言,是一个简单的样式表.代码维护相对老套,不够灵活.LESS介绍 ☞LESS预处理器: 依…

CocosPods 引入项目,哪些文件需要上传到服务器呢?

以上除Podfile外&#xff0c;其它三个文件都不是必须提交的。其中Pods目录没必要提交&#xff0c;里面的文件都是根据Podfile描述的依赖库的配置信息下载和生成的文件。因为CocoaPods支持语义化版本号&#xff0c;所以需要Podfile.lock文件记住当前使用的版本&#xff0c;当然这…