2009-07-28 7 views
0

私は一番右にスクロールバー全体が必要ですが、ウィンドウ内のdivをスクロールするだけです。それ以外のものは静的に留まります。これはCSSのことかJavaスクリプトのことですか?私が得ることができるどんな助けにも感謝します。ありがとう。スクロールオブジェクトの横にないスクロールバーを持つ方法はありますか?

+0

私はそれが驚き最小の原則に違反するとして、あなたは、これを行わないことをお勧めするつもりです:http://en.wikipedia.org/wiki/最古の酒造りの原則 – Powerlord

答えて

0

これはCSSのことです。永遠のelsesの位置を固定しなさい

1

overflow: autoまたはoverflow: scroll助けのどちらかをするか。参照するthe specはもっと説明するのに役立ちます。

0

移動したくないものについては、「位置:固定」というCSSプロパティを使用して、他のすべてを正常にします。

次のことを試してみてください:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
<head> 
<style type="text/css" media="screen"> 
.maincontent{ 
    width:300px; 
    margin:30px 100px; 
} 
.static1{ 
    position:fixed; 
    top:10px; 
    left:100px; 
    width:300px; 
    height:20px; 
    background:red; 
} 
.static2{ 
    position:fixed; 
    top:10px; 
    right: 30px; 
    width:100px; 
    height:40px; 
    background:green; 
} 
.static3{ 
    position:fixed; 
    top: 300px; 
    left: 30px; 
    width:100px; 
    height:40px; 
    background:blue; 
} 
</style> 
</head> 
<body> 
<div class="maincontent"> 
    <h2>this is my main content that I want to scroll</h2> 
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In commodo mi nec sapien feugiat sit amet fermentum odio pretium. Nulla et velit risus. Aenean lectus sem, semper vel interdum ut, elementum ac tortor. Suspendisse aliquam lectus quis elit adipiscing dignissim. Nullam turpis dui, tincidunt quis egestas id, auctor quis purus. Morbi ac augue eu diam tempus venenatis tempor ut orci. Curabitur nec massa eget est porttitor euismod. Nam elementum tempus mauris. Duis eleifend lorem sed odio vestibulum tincidunt. Vestibulum nisl massa, imperdiet quis egestas nec, molestie sed ipsum.</p> 

    <p>In quis ornare felis. Vivamus a neque mi. Sed ac mi id nunc porta commodo. Quisque ipsum tellus, elementum a aliquam ut, convallis vitae leo. Aenean pulvinar, tellus in interdum vehicula, sapien eros sodales felis, sed tincidunt justo arcu id ipsum. Integer lacus risus, scelerisque sed pharetra sed, vehicula in enim. Morbi vitae urna neque. Phasellus enim metus, cursus ac rutrum nec, porttitor non ipsum. Suspendisse tempor vestibulum sapien, non lobortis magna vestibulum at. Nulla hendrerit adipiscing massa eu faucibus. Donec est ligula, luctus eu semper pretium, facilisis a tortor. Suspendisse malesuada vulputate est in lacinia. Fusce cursus cursus ipsum sit amet porta.</p> 

    <p>In in ligula at urna varius tristique. Mauris vitae tellus vel est vestibulum porta. Nulla feugiat ipsum rhoncus turpis elementum sed aliquam tortor volutpat. Mauris mauris sem, consectetur sed fringilla a, feugiat eu nunc. Proin a nibh orci. Praesent gravida rutrum sodales. Quisque eget dui ac massa vestibulum vestibulum non id purus. Praesent velit purus, commodo at scelerisque vitae, pretium sit amet lacus. Praesent faucibus lacus quis turpis condimentum sit amet tincidunt augue tempor. Nunc scelerisque ultricies lorem in gravida. Curabitur est turpis, feugiat vel auctor non, convallis id elit. Morbi arcu orci, vulputate non cursus id, tincidunt ac lectus. Vivamus sed dui mauris, quis lobortis diam. Maecenas auctor arcu eu turpis rhoncus feugiat. Curabitur nisi quam, auctor non porta eu, hendrerit eu eros.</p> 
<div class="static1"> 
    static content 1 
</div> 
<div class="static2"> 
    static content 2 
</div> 
<div class="static3"> 
    static content 3 
</div> 
</body> 
</html> 
関連する問題