IE and Firefox (Firefox) browser to the JS and CSS support of a few different places:
1.firefox cannot support innertext, nor do I know why. Firefox support innerHTML but do not support innertext, so the Internet check, the original it to support textcontent to achieve innertext, but not so good, the default to the extra space also retained. If you don't use textcontent, you can replace it with innerHTML if it doesn't contain HTML code.
2. Prohibit selection of Web page content:
In IE, js:obj.onselectstart=function () {return false;}
and Firefox uses Css:-moz-user-select:none
3. Filter support (example: Transparent filter):
IE:filter:alpha (opacity=10);
firefox:-moz-opacity:.10;
5. Get the mouse position:
IE:event.clientX, Event.clienty
Firefox: Event functions are required to pass event objects
Obj.onmousemove=function (EV) {
X= Ev.pagex; Y=ev.pagey;
}
Boundary issues for elements such as 6.DIV:
For example: Set the Css::{width:100px;height:100px;border of a div: #000000 1px solid;}
ie: div width (including border width): 100px,div height (including border width): 100px;
The width of the firefox:div (including the border width): The height of the 102px,div (including the border width): 102px;
So in doing this compatible with IE and Firefox drag windows, in the JS and CSS to the writing of the brain, to give you two tips
I. Determine the browser type:
var isie=document.all? True:false;
I wrote a variable, if the support document.all syntax so isie=true, otherwise isie=false
Two. CSS processing in different browsers:
You can generally use!important to prioritize CSS statements (Firefox only)
For example: {border-width:0px!important;border-width:1px;}
Under Firefox this element is not a border, in IE under the border width is 1px
also found a few XHTML and normal state of JS, CSS differences The previous stage has written a compatible Ie/firefox drag window found a few differences between the two browsers: found a few IE and Firefox js and CSS a few different points "original"
Today, I wrote a compatible version of XHTML, because now is not a popular web standard, I can not fall behind Ah! And now all the pages in asp.net are applying XHTML standards, and if you delete this standard code in the layout page, the layout and controls inside the Visual Studio are not displayed.
Oh, at the beginning of the page add this code is called the XHTML standard <! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
Changed JS and CSS, debugging n times, found several different points of XHTML standards:
1.document.documentelement and Document.body
You must use the CSS in your code to set the page: Document.documentelement
For example: document.documentelement.style.overflow= ' hidden ';
Overflow-x, overflow-y These two-coordinate attributes XHTML are not supported;
2. Use document.documentelement when obtaining the page window area and getting the scroll distance
That is, these four attributes (ClientWidth, ClientHeight, ScrollLeft, scrolltop) must be used Document.documentelement
But Document.body.appendChild () and Document.body.removeChild () are available, and document.documentElement.appendChild () and Document.documentElement.removeChild () instead will be an error;
So I summed up just clientwidth, clientheight, ScrollLeft, ScrollTop and Document.documentElement.style only use Document.documentelement.
3. Oh, add this standard after the Internet Explorer's border problem has also changed, and Firefox is now in line, is not this is the advantages of XHTML-Cross-browser standards
The previous article mentions:
Set the Css::{width:100px;height:100px;border of a div: #000000 1px solid;}
IE (normal): div width (including border width): 100px,div height (including border width): 100px;
Firefox (normal):: Div width (including border width): 102px,div height (including border width): 102px;
After adding XHTML standards (IE and Firefox hit and ^_^):
IE (XHTML): The width of the div (including the border width): The height of the 102px,div (including the border width): 102px;
Firefox (XHTML):: The width of the div (including the border width): The height of the 102px,div (including the border width): 102px;
The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion;
products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the
content of the page makes you feel confusing, please write us an email, we will handle the problem
within 5 days after receiving your email.
If you find any instances of plagiarism from the community, please send an email to:
info-contact@alibabacloud.com
and provide relevant evidence. A staff member will contact you within 5 working days.