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 回答