Posted by Jonathan N. Little on 08/29/06 15:34

HJ wrote:
> Thanks for the reply. The idea is to have a html file that can be used
> by 2 kinds of users. One can only see the block, one can actually click
> on the links.
>
> So for the first kind of user, I want to have a transparent image to
> cover the html block.
>
> The following is the code I got now.
> //*******************************************************
>
> <style type="text/css">
> #inner{
> background-image: url("../images2/misc/clear.gif");
> z-index: 1;
> width:100px;
> border:1px solid #ddd;
> }
>
> #inner2{
> z-index: -1;
> position:relative;
> width:400px;
> }
> </style>
>
>
> <DIV>
> <div id="inner">
> <div id="inner2">
> <p>Left Content goes here</p>
> <p>Left Content goes here</p>
> <p><a href="http://www.yahoo.com">Yahoo</a></p>
> <p><a href="http://www.yahoo.com">Yahoo</a></p>
> <p><a href="http://www.yahoo.com">Yahoo</a></p>
> <p><a href="http://www.yahoo.com">Yahoo</a></p>
> <p><a href="http://www.yahoo.com">Yahoo</a></p>
> <p>Left Content goes here</p>
> <p>Left Content goes here</p>
>
> </div>
> </div>
> </DIV>
> //*******************************************************
>
> clear.gif is the transparent image. Now the image is growing as the
> content grows. So the whole problem is solved.
>
> However, this only work in IE, Firefox ignores the Z-index, because in
> inner2 the z-index is -1. In Firefox the whole black is just a big
> white space. After change the z-index to become 2 and 1, the content
> shows up, but it doesn't appear to follow the order. inner2 show on top
> of inner.
>
> So any solutions...

Yeah! Far better to dynamically generate the page with server-side
script of your choice and for one create the links other just plain text.

<?php
if($visitor=='privileged'){
include_once("listOfLinks.php");
}
else {
include_once("plainTextList.php");
}
?>

This will *always* work in all browsers.

--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com

[Back to original message]