|
|||||||
 |
|
|
LinkBack | Thread Tools | Search this Thread | Rate Thread | Display Modes |
05-22-2001, 04:46 PM
|
#1 |
|
Member (6 bit)
Join Date: Dec 1999
Location: United Kingdom
Posts: 35
 |
Show-Hide Layer Positions
Please take a look at this page on my website:
http://www.ashburrn.com/main.html If you have a generation 5 browser, you will see that layers pop up when you move your mouse over the relevant links at the top. Those pop-ups are layers. The problem is, I want those layers to appear BENEATH their relevant links, and under different resolutions or window sizes, this is not possible. Please help. |
|
|
|
05-22-2001, 05:38 PM
|
#2 |
|
Guest
Posts: n/a
|
I believe you can use JavaScript for this.
if (screen.pixeldepth = ?) { //set CSS layers relative to pixel depth } if (screen.height = ?) { //set CSS layers relative to height } if (screen.width = ?) { //set CSS layers relative to width } or you can make a more complicated formula... Is this syntax right guys? Last edited by MITotaku; 05-22-2001 at 06:08 PM. |
|
|
|
05-23-2001, 02:47 AM
|
#3 |
|
Member (6 bit)
Join Date: Dec 1999
Location: United Kingdom
Posts: 35
|
What exactly does that script do?
And what should I fill in for those blanks? |
|
|
|
|
05-23-2001, 08:20 AM
|
#4 |
|
Guest
Posts: n/a
|
The script really doesn't do anything...
I was just telling you how you could set up your CSS using JavaScript. Screen.width and screen.height are the dimensions or resolution of the screen. If you know how "if" statements work... you change the '?' for width to something like 800 and the '?' for height to something like 600. Then when the script detects the resolution you can set up your layer posistion relative to that information. Off hand I don't know all the .style (CSS) stuff for JavaScript so I'll have to get back to you on what to put in the brackets. |
|
|
|
05-23-2001, 09:26 AM
|
#5 |
|
SQL nutcase
Join Date: Sep 2000
Location: Belgium
Posts: 1,136
 |
Try this code:
Code:
<html>
<head>
<title>test</title>
</head>
<script>
<!--
function showornot(section_ID, source){
if (section_ID.style.display=="none"){
section_ID.style.position="absolute";
section_ID.style.display="";
x = getPageOffsetLeft(source);
y = getPageOffsetTop(source) + source.offsetHeight;
section_ID.style.left = x + "px";
section_ID.style.top = y + "px";
}
else{
section_ID.style.display="none";
}
}
function getPageOffsetLeft(el) {
// Return the true x coordinate of an element relative to the page.
return el.offsetLeft +
(el.offsetParent ? getPageOffsetLeft(el.offsetParent) : 0);
}
function getPageOffsetTop(el) {
return el.offsetTop +
(el.offsetParent ? getPageOffsetTop(el.offsetParent) : 0);
}
-->
</Script>
<body>
<center><a id="menu" href="" onmouseover="showornot(popmenu, menu);"
onmouseout="showornot(popmenu, menu);">menu</a></center>
<div id="popmenu" style="position: absolute; display:none;
border-style: solid; border-color: black; border-width: 1px; width: 50px;" >blablabla</div>
</body>
</html>
|
|
|
|
|
05-23-2001, 06:34 PM
|
#7 |
|
Member (6 bit)
Join Date: Dec 1999
Location: United Kingdom
Posts: 35
|
Hi mosquito
Thanks so much .. I sorted it out on my page with your code .. I've put some credits in the HTML. Thanks a lot! 
|
|
|
|
|
05-25-2001, 02:52 AM
|
#8 |
|
SQL nutcase
Join Date: Sep 2000
Location: Belgium
Posts: 1,136
|
no problem
|
|
|
|
|
| Bookmarks |
| Thread Tools | Search this Thread |
| Display Modes | Rate This Thread |
|
|
Linear Mode
