0

私は次のcssと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>

上記のコードは、divの垂直スクロールバーを作成し、デフォルトでは、スクロールバーが常に一番上に表示されます。スクロールバーの位置を変更したい場合、つまり。私が与える高さに応じて中央またはどこかで(目に見えるliコンポーネントも変化するように)言います、どうすればそれを行うことができますか?

html / cssとjavascript(動的)の両方での解決策は大歓迎です。

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 に答える