PDA

View Full Version : How do i detect page direction



jim77
02-03-2010, 01:52 PM
Hi all,

I noticed that when the 'direction' is set to an external css file, it's not possible to detect page's 'direction' property via javascript. It returns NULL



var elm=document.getElementsByTagName('body');

if(elm[0].dir=='rtl'||elm[0].style.direction=='rtl')
return true;
else
return false;

any suggestions?

jscheuer1
03-04-2010, 01:08 PM
Taken loosely from:

http://www.quirksmode.org/dom/getstyles.html


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
body {
direction: rtl;
}
</style>
<script type="text/javascript">
function getStyle(el,styleProp)
{
var x = document.getElementById(el) || document.body;
if (x.currentStyle)
var y = x.currentStyle[styleProp];
else if (window.getComputedStyle)
var y = document.defaultView.getComputedStyle(x,null).getPropertyValue(styleProp);
return y;
}
onload = function(){alert(getStyle(null, 'direction'));};
</script>
</head>
<body>
Hi
</body>
</html>

Notes: This will even work if the direction hasn't been set, returning the default (ltr), or if it is set using the dir attribute, returning whatever the computed style direction is for the element. For style properties that contain hyphens, the camel style notation would be required for half of the getStyle function. So, if you intend to use this for other properties (direction is safe because it's all one word) you may have to deal the the camel/hyphen issue.

jim77
03-18-2010, 09:34 AM
Hi John, many thanks for you it's really helped me