Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 270
  • Last Modified:

tranparent div on a html page or div

i want to put a transparent div ( only consist of a centered transparent image so i can see the page with text or something behind it ) and also the javascript to move it to centered of the page
thx
0
Beler
Asked:
Beler
  • 2
1 Solution
 
voskCommented:
You can use a filter, but only for MSIE.
Here's an example:
<html>
<head>
<script language="JavaScript">
function A()
{
var x, y;
x = screen.availHeight;
x = x / 2;
x = x - 200;
y = screen.availHeight;
y = y / 2;
y = y - 140;
document.all.im.style.pixelLeft = x;
document.all.im.style.pixelTop = y;
document.all.text.style.pixelLeft = x;
document.all.text.style.pixelTop = y;
}
</script>
</head>
<body onLoad="A();">
<img id="im" src="image.gif" style="position:absolute;visibility:visible;top:0;left:0;z-index:2;filter:alpha(opacity=50)">
<table id="text" style="position:absolute;top:0;left:0;z-index:1" width="600">
<tr><td>
That is the text behind the transparent imageThat is the text behind the transparent image
That is the text behind the transparent imageThat is the text behind the transparent image
That is the text behind the transparent imageThat is the text behind the transparent image
That is the text behind the transparent imageThat is the text behind the transparent image
That is the text behind the transparent imageThat is the text behind the transparent image
That is the text behind the transparent imageThat is the text behind the transparent image
</td></tr>
</table>
</body>
</html>
I have used a 600x280 image. You can change the opacity (from 0 to 100).
jbosch(vosk)
0
 
BelerAuthor Commented:
Thx, sorry for waiting heheh :)
0
 
voskCommented:
No problem. I'm glad to help.
jbosch(vosk)
0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now