0

私が取り組んでいる Web ページでは、特定のビューポートに収まるように div をスケーリングしています。内側の div の 1 つは、div 内でスクロールするときに上部に保持するために位置が固定されています。

<div id='a'>
    <div id = 'b'>This should be fixed</div>
    <div id = 'c'>normal</div>
    <div id = 'd'>normal</div>
</div>

ただし、CSS トランスフォームを使用して div をスケーリングすると、ページの上部に留まらなくなります。何をすべきか、またはなぜこれが起こるのかについての説明はありますか?

#a{
    height: 2000px;
    transform-origin: 0% top;
    transform: scale(0.96, 0.96);
    -webkit-transform-origin: 0% top;
    -webkit-transform: scale(0.96, 0.96); 
}
#b{
    position: fixed;
}

私がやろうとしていることを示すために jsfiddle を提供しました: http://jsfiddle.net/pkoq8ctj/

4

1 に答える 1

0

修正された場合、他のdiv内にある必要はないように感じます。これがフィドルです。

http://jsfiddle.net/ivanjsfiddle00/pkoq8ctj/1/

<div id = 'b'>This should be fixed</div>
<div id='a'>
    <div id = 'c'>normal</div>
    <div id = 'd'>normal</div>
</div>
于 2014-12-19T21:06:28.007 に答える