1

我想制作一个垂直滚动但不水平滚动的 div。这是很好地解释了该过程的图像。

![在此处输入图像描述][1]

我希望 Y 轴在右侧滚动时保持静止。这是我的 HTML 代码

 <div id="i">
    <div class="column">
     <div id="y_axis"></div>
       <div id="chart"></div>
    <div id="x_axis"></div>
     </div>

Div Chart 是条形所在的位置。每当我向右滚动时，只有图表向右移动而不是 Y 轴。

CSS

 #chart {

        left: 40px;
        display: block;
float:right;
    }
    #y_axis {
        position:fixed;
        top: 14px;
        bottom: 0;
        width: 40px;
        background-image: url('../img/avg_price.PNG');
        background-repeat: no-repeat;
        background-position:center left;
float:right;


    }
    #x_axis {
        position: relative;
        left: 40px;
        height: 40px;
    }

尝试使用 Position relative 来改变 yaxis 本身的位置但不起作用。我应该在这里做什么？

4

1 回答 1

2

我假设你喜欢这样的事情：Demo Fiddle

我在您的标记中从 a 切换background-image到标签。img我还修改了你width的 's 以调整图像的溢出并取出chart div：

<div id="i">
  <div class="column">
    <div id="y_axis"><img src="img/src/goes/here"/></div>
    <div id="x_axis"><img src="img/src/goes/here"/></div>
  </div>
</div>

注意：您可以调整 CSS 高度和宽度以满足您的需要。

于 2013-05-22T13:56:04.867 回答