Log in

View Full Version : Div position according to X


emanuelle
02-17-2009, 08:13 AM
I have a div that needs to open according to the position of a link. The link appears on many pages at different position and the div MUST always open next to it.



how do I do this????
Snookerman
02-17-2009, 08:43 AM
How are you showing the div? It would be much easier to help you out if you could post a link to your site.
emanuelle
02-17-2009, 09:00 AM
here is the code

<html>
<head>
<title>Untitled</title>
<script>
function showd(element) {
var el = document.getElementById(element);
el.style.display = "block";
}

function closeContentD(element) {
var el = document.getElementById(element);
el.style.display = "none";
}
</script>

<style>
.div_watch_commentst_right{position:absolute;left:100px;top:100px;}
</style>
</head>
<body>
<a href="#" onClick="showd('myDivcom')" class="link">link1</a>
<div id="myDivcom" style="display:none;border:1px solid red;width:350px;" class="div_watch_commentst_right">text comes here</div>
<br>
<a href="#" onClick="showd('myDivcom')" class="link">link2</a>
</body>
</html>

I want the DIV to ALWAYS open close to its link
Snookerman
02-17-2009, 09:10 AM
How about this:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>
<script>
function showd(element) {
var el = document.getElementById(element);
el.style.display = "inline";
}
function closeContentD(element) {
var el = document.getElementById(element);
el.style.display = "none";
}
</script>
</head>
<body>
<a href="#" onClick="showd('myDivcom')" class="link">link1</a>
<div id="myDivcom" style="display:none;border:1px solid red;width:350px;">text here</div>
<br>
<a href="#" onClick="closeContentD('myDivcom')" class="link">link2</a>
</body>
</html>


Good luck!
emanuelle
02-17-2009, 09:14 AM
not really.sorry
forget about the close function.
I want both my links to open the same div but the div will be positionned next to the relevant link