0

I have the following css and html :

<head>
<style type="text/css">
ul > li {
    position:relative;
    margin:0;
    list-style:none;
    padding:0;
}
ul{
padding:0;
margin:0;
}
</style>
</head>
<body >
<div style="position:absolute;top:40%;width:100;height:50%;border:1px solid red;overflow:auto;offsetTop:10px">
<!--<a onclick='calla()' disabled="disabled">Delete</a>-->
<ul>
<?php
for ($i=0;$i<50;$i++){
?>
<li>Test li_<?php echo $i; ?> 
</li>
<?php
}
?>
</ul>
</div>

The above code creates a vertical scrollbar for the div and by default the scrollbar always comes at the top. If I want to change the scrollbar location ie. say at the middle or anywhere according to the height I give(so that the visible li components also change), How can I go about doing it?

Solution both in html/css and javascript(dynamically) is most welcome.

4

2 回答 2

1
<html>
<head>
<style type="text/css">
ul > li {
    position:relative;
    margin:0;
    list-style:none;
    padding:0;
}
ul{
padding:0;
margin:0;
}

p { margin:10px;padding:5px;border:2px solid #666;width:1000px;height:1000px; }

</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body >
<div class="demo" style="position:absolute;top:40px;width:100;height:60%;border:1px solid gray;overflow:auto;offsetTop:10px">
<!--<a onclick='calla()' disabled="disabled">Delete</a>-->
<ul>
<?php
for ($i=0;$i<50;$i++){
?>
<li>Test li_<?php echo $i; ?></li>
<?php
}
?>
</ul>
</div>
<script>$("div.demo").scrollTop(300);</script>
</body>
</html>
于 2012-10-18T05:29:13.467 回答
0

使用 jquery 的 scrollTop() 方法。

请参考:http ://api.jquery.com/scrollTop/

于 2012-10-18T05:22:56.103 回答