兼容性及相关问题总结

以下是在前端开发过程中遇到的一些问题:

1.a标签中加onclick事件时,ie6下链接不可用

解决方案:

在onclick的事件的方法后面加:return false;

<a href="javascript:void(0); onclick="方法(); return false;"></a>

2.ie6下下拉列表框区域增大

解决方案:在外边的div中添加:overflow-x:hiddden;

3.输入框input在div中无法居中

解决方案:加左浮动,然后用margin-top向下压下来

4.ul一行中有小图标,且在ie6中数据高度超过原有的行高

解决方案:加margin-top使图标居中,加line-height(行高-居上的高度)

5.页面嵌入iframe,iframe自适应高度导致页面显示不全

解决方案:设置嵌入iframe高度,如果在该页面有弹出的遮罩层,可以设置遮罩层绝对定位。

6.在数据列表中针对某一列进行操作,弹出相关的操作项被下面的数据遮挡

解决方案:列表默认是第一层,鼠标点击时层数加1
var zIdx=1;
function watchmoneyover(id){
zIdx++;
$(‘#‘+id).css(‘z-index‘,zIdx).find(‘.watch_money‘).show();
};

如果非列表中的数据被列表数据遮挡,可以设置非列表中的弹出div的样式的z-index:9999;

7.ul去除前面的小点

给ul加属性:list-style-type:none;

8.浏览器针对margin的重叠,在水平方向上没有重叠,在垂直方向是哪个存在重叠,取最大的一个,
解决方案,上面的一个div加overflow:hidden;
下面的div:float:left; display:inline;

9.clear:none——允许两边都可以有浮动对象
clear:both——不允许有浮动对象
clear:left——不允许左边有浮动对象
clear:right——不允许右边有浮动对象

10.div模块要放到object上面时,在div下面加一个与该div等大的iframe,

$(‘#bank_td‘).append(‘<iframe frameborder="0" id="overlay" style="position:absolute; width:‘+ $(‘.bank_list‘).outerWidth() +‘px; height:‘+ $(‘.bank_list‘).outerHeight() +‘px; left:0; top:42px; ">‘);

同时在点击完成后移除iframe,$(‘#overlay‘).remove(‘‘);

同时object需要加入:
<param name=‘wmode‘ value=‘Opaque‘/>

或者

在点击弹出一个弹出框,但是该弹出框下面有一个object时,可以在弹出时隐藏object,关闭弹出时,显示object

时间: 2024-07-29 10:56:56

兼容性及相关问题总结的相关文章

web兼容性测试相关知识

一.客户端兼容性 1.浏览器的兼容性测试 a.内核角度 Tridnt内核:代表作IE.腾讯.遨游.世界之窗等 Gecko内核:代表作Firefox webkit内核:代表作Safari.Chrome Presto内核:代表作Opera Presto是由Opera Software开发的浏览器排版引擎,它是世界上最快的渲染速度引擎,在13年后,Opera宣布加入谷歌阵营,启用了. Blink内核:由Google和OpearSoftware开发的浏览器排版引擎,2013年4月发布.现在Chrome内

html标签和css基础语法与浏览器兼容性等相关基础学习

<!-- table的使用 --> <h3>前端日常</h3> <form action="https://www.baidu.com"> <table border="1px" cellspacing="0px"><!--cellspacing单元格间隙--> <thead></thead><tbody> <col span=&qu

11G新特性 -- ASM的兼容性

Oracle 11g中,asm同时支持10g和11g数据库.但是asm的版本不能低于数据库的版本. 与兼容性现相关的两个参数: ·compatible.rdbms 支持的最低版本的oracle数据库版本. ·compatible.asm 控制ASM元数据在asm磁盘上的数据存放格式.比如,如果设置compatible.asm的值为11.1,则ASM软件版本至少必须是11.1.  ASM兼容性级别至少要与rdbms的兼容性相同,不能低于rdbms的兼容性级别.compatible.asm只是控制a

通过修改manifest文件来解决Vista/Win7/Win8下应用程序兼容性问题

在Vista/Win7/Win8下,有一个系统兼容性助手功能,在安装程序安装完成或卸载完成后,可能会弹出应用程序兼容性助手相关的提示,提示程序可能安装不正确,很是烦人.如下图所示: 事实上,我们的程序兼容性是没问题的,只不过是在程序中没有指定应用程序兼容的操作系统,所以导致了这些问题.      VS2008和VS2010可以生成一个与exe应用程序相关联的.manifest文件,微软已经为该文件中添加了一个新的<compatibility> 字段, 这个字段用来指定你的应用程序可以兼容的操作

css专题学习-浏览器兼容性问题目录

此帖是我所分享的浏览器兼容性问题相关的所有目录. [分享]浏览器兼容性问题综述 -- 正确的认识浏览器兼容性问题 [分享]你的元素居中对齐了吗? --- 关于 'text-align:center' 的问题 [分享]<a>标签的伪类书写顺序问题 [分享]IE6 中 A 标签 hover 伪类特殊性过高的问题 [分享]深入挖掘document.getElementsByTagName()方法的返回值 [分享]警惕你的 Date 对象 [分享]重新认识IE盒模型bug [分享]你知道吗?--- 表

前端开发人员走向

一个全能的前端可以做如下事情:1.产品官网,切稿,浏览器兼容性,相关页面特效.2.产品后台,UI框架使用,图表插件,各种web插件使用,前后端通信,相关页面特效.3.H5页面,也分CSS3特效,既移动浏览器兼容性,响应式页面.4.web组件开发,看各种js源代码,jquery源代码,js框架源代码.5.html5游戏开发,游戏开发相关的知识,游戏框架的使用. 各种学习:浏览器机制(通信,事件,跨域,缓存),css渲染机制,javascript引擎机制,设计模式和函数式,http协议,ps基础切页

多列布局之等分布局

在实际网页布局中,我们可能会需要设置等分布局. <div class="parent"> <div class="column"><p>1</p></div> <div class="column"><p>2</p></div> <div class="column"><p>3</p>

已将GitHub scrapy-redis库升级,使其兼容最新版本Scrapy

1.代码升级 之前的问题: 随着Scrapy库的流行,scrapy-redis作为使用redis支持分布式爬取的工具,也不断的被大家发现. 但是,使用过程中你会发现的问题是由于scrapy-redis是基于较老版本的Scrapy,所以当你使用的是新版本的Scrapy时,不可避免的会出现警告,甚至错误. 关于这个问题,我总结之后在scrapy-redis库中提了出来并开了issue和作者做了讨论,在确定思路后,就着手进行代码升级. 解决: 花了一段时间修改后向原代码库提交的pull request

基于Jquery实现的轮播图

前阵子我用js写了一个轮播图,现在的话换成jQuery来实现,先看看效果图 首先是html结构,如下: <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>jquery版图片轮播</title> <link rel="stylesheet" href="css/index.css" /> &l