Cursor (caret) fails to appear in input text fields with "Fixed Position" in Firefox

V

vunet.us

Mozilla reported the fix to this bug: https://bugzilla.mozilla.org/show_bug.cgi?id=167801.
When input text field is located over div, the cursor cannot be seen
unless special CSS properties are applied. The link above illustrates
many example.
The problem I came across with, is almost identical, except that I
need to use position:fixed for my div element instead of
position:absolute as in all examples illustrated on Mozilla link. It
is related to Firefox only and the reason why I have to use a fixed
position is because my div must be always spread all over the page
even during page scrolling.
How is it possible to find a workaround here?
Thank you
 
V

vunet.us

Almost forgot the copy/paste test case:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
<html><head>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1">

<style type="text/css">
#fadedBackground{
position:absolute;
background-color:black;
filter:alpha(opacity=30);
-moz-opacity:.30;
opacity:.30;
top:expression(this.offsetParent.scrollTop);/*IE only*/
z-index:1;
}
#myTable{position:absolute;z-index:2;background-color:gray;}
</style>

<script language="JavaScript">
function fadeBackground() {
var d = document.getElementById("fadedBackground");
if(d.style.visibility=="hidden"){
if(navigator.userAgent.indexOf("Firefox")!=-1)
{d.style.position="fixed";}
//IF LINE ABOVE IS NOT USED FOR FF, BACKGROUND DOES NOT COVER
SCROLLING AREA
d.style.visibility = "visible";
d.style.height = "100%";
d.style.width = "100%";
}else if(d.style.visibility=="visible"){
d.style.visibility = "hidden";
d.style.height = "0px";
d.style.width = "0px";
}
}
</script>

</head>

<body topmargin="0" leftmargin="0" rightmargin="0">

<div id="fadedBackground" style="visibility:hidden;"
onClick="fadeBackground();"></div>
<table id="myTable" cellpadding=5>
<tr><td><input type="text" value="Where is Cursor?"></td></tr>
</table>
<br><br><a href="javascript:void(0)" onClick="fadeBackground();">Click
Here to Change Background</a>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
</body>
</html>
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,994
Messages
2,570,223
Members
46,813
Latest member
lawrwtwinkle111

Latest Threads

Top