Today, at my work I need to implement java script for a SharePoint web page. First I developed the javascript in simple HTML page and after it is successful running I moved the code to SharePoint page.
In html page, it was working very fine and on the SharePoint page it was not. After some research I found the problem in the line document.documentElement.clientWidth and document.documentElement.clientHeight. I don’t know what the problem with this. I was browsing both HTML page and SharePoint page in the same browser. This behavior is weird.
Solution:
I researched on the javascript functions and read all the properties available for the document object and below is the code I came up with.
function GetWindowProps() { var browserWidth = 0, browserHeight = 0; //For checking non-IE browsers Mozilla, Safari, Opera, Chrome. if (typeof (window.innerWidth) == 'number') { browserWidth = window.innerWidth; browserHeight = window.innerHeight; } //All IE except version 4 else if (document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight)) { browserWidth = document.documentElement.clientWidth; browserHeight = document.documentElement.clientHeight; } //IE 4 else if (document.body && (document.body.clientWidth || document.body.clientHeight)) { browserWidth = document.body.clientWidth; browserHeight = document.body.clientHeight; } }
This will give you the correct values and it will work for any browser. How is it?
How 'bout you use JQuery and forget it?
ReplyDeleteWas there ever a solution or a reason for this behaviour. I also have a problem with height:expression(document.body.clientHeight-82) not working under Sharepoint 2010 (it dit under 2007). It remains a mystery. If at all - is there a JQuery clientside script that auto-adjusts the hieght - please let me know
ReplyDeleteFound the answer yesterday. I removed the Doctype (XHTML) and set the UX compatibility to IE7. Dont know if the later was needed, but when it worked I was happy it did.
ReplyDelete