Question

我想创建一个垂直滚动而不是水平滚动的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;
    }

尝试使用位置相对来改变y轴本身的位置但不起作用。我该怎么办？

Answer 1

我假设你这样： Demo Fiddle

我从标记中的background-image转换为img标记。我还修改了您的width以调整图片溢出并取出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高度和宽度以满足您的需求。

在水平滚动时创建静态Div

1 个答案: