1

カーソルを隅に置いたときに表示されるページのスクロールバーを作成するにはどうすればよいですか?

以下を使用して、ホバー時にスクロールバーを表示および非表示にする方法を見つけました。

div { overflow:hidden;height:whatever px; }

div:hover { overflow-y:scroll; }

ただし、それは div タグにのみ適用されます。ページの右端にカーソルを置いたときにのみスクロールバーが表示されるようにします。body代わりに使用してみdivましたが、コンテンツの少ないページまですべてのページが邪魔されます。

その方法を教えてください。

4

1 に答える 1

2

私が理解したことは、あなたがこのようなものが欲しいということです

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Liveweave</title>

  <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

  <script>

    $(document).ready(function(){
      $('.right').hover(function(){
       $('.box').css('overflow-y','scroll');
      },function(){
        $('.box').css('overflow','hidden');
      });
    });
  </script>


    <style type="text/css">  


.box
{
     overflow:hidden;
     width: 100px;
     height: 100px;
     background-color: yellow;
     overflow: hidden;
}

.box:hover
{
        /*overflow-y:scroll;*/
}

      .body{width:100%}
      .right{float:right;min-height:50px;position:absolute;right:0}

    </style>

</head>  

<body>
<div class="body">
  <div class="right">
    right edge
  </div>
  <div class="box">asdfsadfsdafsdafsdaf,
   sdfsdfsdfsdfsdfsd
    sadfsd

    sdf
    sadf
    sdf
    dsf
    sdfdsfsdfsdfsdfsdfsdaf
    sdffsdf</div>






</body>




</html>
于 2013-08-12T10:44:12.853 に答える