Hello
I created a layer with a hidden overflow and an other on inside it to be able to have a scrollable text. Everything works fine with a scrollbar and arrows, but if I put a named anchor somewhere in the text, I am unable to get the new position of of the inner layer to adapt the position of the thumb in the scrollbar. The arrows of the scrollbar are getting lost as well.
I tried all the events listed in the MSDN DHTML reference but I got nothing. I tried some existing scripts (Cross-Browser.com, dyn-web.com) but they have the same problem.
If someone have an idea to get this position, I will be very happy
can we see a significant part of the code?
As the example must contain a long text which will be too big for a forum, I hosted it at the following adress: http://www.dommedia.net/tests/scroll.htm
try
function newpos(){
var posa = document.form1.newpos.value;
var docObj2 = document.getElementById('content');
var objTop2 = document.defaultView.getComputedStyle(docObj2, "").getPropertyValue(posa);
document.form1.newpos.value = 'pos2 = ' + objTop2;
}
No result.
It seems that the movement of the text after clicking on an anchor link have no property.
Does the following help?
<html>
<head>
<title>scroll</title>
<style type='text/css'>
#content{
position: absolute;
overflow: hidden;
z-index: 1;
width: 400px;
left: 150px;
top: 150px;
background-color: #F0EFEF;
height: 290px;
}
</style>
<script type="text/javascript">
<!--
function go_anchor(n){
document.getElementById("content").scrollTop = document.getElementById(n).offsetTop
}
// -->
</script>
</head>
<body>
<div id="content">
<h3>Lorem ipsum</h3>
<p><a href="#null" onclick="go_anchor(4)">link 4</a></p>
<p>1- Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed laoreet lobortis nibh. Mauris et lacus. Etiam tempor. Etiam dapibus nisl lobortis quam dapibus elementum. Ut hendrerit, purus sit amet hendrerit ullamcorper, massa risus facilisis sapien, vel suscipit mi turpis vel erat. Morbi ligula sapien, pellentesque vitae, tristique et, rutrum nec, nunc. Nam tortor magna, dignissim eget, hendrerit quis, tincidunt ut, lorem. Pellentesque neque. Sed ut felis at wisi fermentum porttitor. Praesent ligula mauris, eleifend quis, pellentesque ut, mollis laoreet, ligula. Donec nisl lorem, suscipit in, malesuada eu, posuere nec, metus. Pellentesque gravida quam commodo libero. Nullam auctor vehicula libero. Ut at dui et velit dapibus ornare. Donec dignissim eleifend tellus. Fusce at erat. Nulla sit amet ligula non neque interdum pellentesque. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas lorem. Aliquam rhoncus, dolor ut semper convallis, nunc libero accumsan diam, in lacinia magna ipsum ac ipsum. </p>
<p>2 - Donec et sem. Pellentesque a orci sed quam ultricies tempus. Aenean sollicitudin lacinia lacus. Ut ac augue in elit molestie tincidunt. Ut ut lectus. Proin adipiscing risus at pede. Duis bibendum. Praesent aliquam imperdiet pede. Donec eget mi. Nulla tellus risus, adipiscing at, fringilla a, rutrum at, tellus. Proin accumsan. Vestibulum non ipsum sit amet lectus posuere convallis. Mauris tempor eleifend lectus. Donec ullamcorper mauris in mi. Sed suscipit urna non nulla. Donec sed magna. Phasellus vulputate, sem sed convallis tristique, elit nisl cursus eros, nec scelerisque diam justo gravida est. Sed odio mi, sagittis a, condimentum vestibulum, rutrum ornare, eros. </p>
<p>3 - Curabitur augue elit, tincidunt non, vulputate et, rutrum sed, ante. Aenean justo tellus, vulputate sit amet, dictum id, sollicitudin a, nisl. Pellentesque sed justo quis sapien volutpat aliquet. Suspendisse dignissim nisl a diam. Suspendisse potenti. Quisque erat erat, sollicitudin a, dignissim ac, ullamcorper non, lacus. Maecenas placerat eros vehicula augue. Nam eleifend mollis lectus. Aliquam orci augue, rhoncus eget, venenatis non, congue a, eros. Quisque non sem. Sed arcu risus, mollis et, accumsan ut, malesuada a, justo. Nunc quis magna. Curabitur est magna, dapibus vel, hendrerit sed, dictum ac, turpis. Curabitur nonummy. Suspendisse lobortis, tortor eu ultricies vulputate, dui elit placerat metus, vitae scelerisque eros neque vel felis. Duis mollis. Proin auctor wisi in quam. Aliquam accumsan, leo vitae suscipit venenatis, lorem orci mollis enim, sit amet tincidunt erat metus sit amet quam. Ut turpis. Nunc gravida, justo quis ullamcorper mattis, purus augue vulputate est, vitae consequat ipsum sapien non quam. </p>
<p><a id="4"></a>4 - Aenean eget magna. Fusce odio erat, luctus quis, molestie sed, egestas sit amet, arcu. Morbi pharetra arcu vitae tellus. Nullam sagittis. Ut risus tellus, cursus quis, luctus sit amet, volutpat quis, enim. In velit. Nunc iaculis, velit vel iaculis vulputate, nulla ante congue neque, non mollis lectus mi nec nisl. Praesent semper congue tellus. Phasellus lorem justo, varius vel, facilisis vel, ornare consequat, nulla. Curabitur massa eros, congue in, consectetuer sed, interdum in, tortor. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Ut dictum euismod ligula. Duis aliquet ante in tortor. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed tellus magna, mattis quis, adipiscing eu, adipiscing in, enim. Morbi elit quam, consequat quis, mollis at, lacinia eu, urna. Vestibulum sit amet pede eget odio vestibulum dignissim. </p>
<p>5 - Nunc leo wisi, interdum ac, lacinia adipiscing, euismod quis, eros. Nulla sagittis lacus pharetra sem. Duis non lacus. Aliquam erat volutpat. Proin sed ipsum et sem euismod molestie. Nulla venenatis mattis turpis. Nullam leo neque, sodales id, rutrum vitae, consectetuer vitae, risus. Curabitur semper lectus eu est. Vestibulum vitae risus. Praesent dignissim, urna id consequat mollis, leo turpis interdum elit, nec rhoncus velit eros ac arcu. Proin ultrices iaculis massa. </p>
</div>
</body>
</html>
It helps!
I had to give the target anchor an id to be an object, a name is not enough. I now have a start and an end position to work with in my example.
Thanks for the help
Sorry about that, I must have had inputs on my mind at the time :D
vBulletin® v3.8.2, Copyright ©2000-2012, Jelsoft Enterprises Ltd.