开发者

Cross browser problem with <div> tab

I have created <div> element, i am doing show/hide that <div> using java script..

but the problem is that the position of that varies on all different browsers

javascript is as follows

 <  script language="JavaScript" type="text/javascript">
var abc=false;
function showHide()
{
var a=document.getElementById("MainDiv");
var b=document.getElementById("myTestDiv");

if(abc==false)
{
abc=true;
b.style.top = a.offsetTop;
b.style.left = a.offsetParent;
开发者_StackOverflow中文版b.style.display = "inline";
}
else{
abc=false;
b.style.display = "none";
}
}
</script>

html is as follows

 <div id="myTestDiv" style="border: 2px solid rgb(100, 149, 237); color:#23238e; background-color:#FFFFFF; position:absolute; width:14%; height:17%; display:none" >


Why b.style.left = a.offsetParent; ? https://developer.mozilla.org/en/OffsetParent

I think you want b.style.left = a.offsetLeft;. Anyway, why you use JavaScript for this? Can't you set position: relative; of MainDiv and top: 0; left: 0; of myTestDiv?


Please try with installing BluePrint CSS Framework and retry your action again again!

Or deliver us some more information about your issue...


You've not provided enough information here, but I'll take a few guesses anyway..

b.style.display = "inline";

Instead of inline, you probably want to be setting it to block, what with the fact that divs are block-level elements.

Something else to try, append px:

b.style.top = a.offsetTop + "px";
b.style.left = a.offsetParent + "px";

Also, make sure you have a proper doctype as the very first line:

<!DOCTYPE html>

Without that, Internet Explorer in particular will be hopelessly broken.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜