1

ポップアップ「CLOSE」テキスト ボタンの作成に問題があります。ポップアップ ボックスには CSS プロパティ、overflow:scroll および position:absolute があります。

JS フィドル: http://jsfiddle.net/saifrahu28/qkfRr/

しかし、左上の「CLOSE」テキストを..の外側に移動したいと思います<div>。そのため、「CLOSE」テキストをスクロールすると、 Show が div の左上に残ります。これは、その div の周りにWrapper Div を配置することで実行できるかもしれませんが、主な問題は、その div をラップすることはできません。これは可能ですか?

その div の外側の左上に The CLOSE テキストを配置します。

クラスのプロパティは削除できませんが、必要に応じて追加できます。jquery または Java スクリプトが必要な場合でも問題ありません。しかし、私は立ち往生していて、結果を見つけたいと思っています。

助けていただければ幸いです。

HTML

<div class="popup">
<p class="close">CLOSE</p>  
<p>
    Lorem Ipsum is simply dummy text of the printing and typesetting industry.
    Lorem  Ipsum has been the industry's standard dummy text ever since the 1500s, 
    when an unknown printer took a galley of type and scrambled 
    it to make a type      specimen book. It has survived not only five centuries, 
    but also the leapinto electronic typesetting, remaining essentially
    unchanged. It was popularised in the 1960s with the release of Letraset 
    sheets containing Lorem Ipsum passages, and more 
    recently with desktop publishing software like Aldus PageMaker 
    including versions of Lorem Ipsum.

</p>
</div>

CSS

.popup{
height:100px;
overflow:scroll;
width:400px;
background:#fafafa;
margin-top:50px;
position:absolute;
}
.close{
  color:red;
}
4

2 に答える 2

1

これを行うことができますposition: fixed

デモjsFiddle

.close{
   color:red;
    position:fixed;
    z-index:1000;
    top:10px;
    left: 0;
}
于 2013-08-24T17:34:42.643 に答える
0

css を再編成して、コンテンツ オーバーフローのみを非表示にします。

http://jsfiddle.net/qkfRr/1/

.popup{
    position:absolute;
}
.popup .content {
    height:100px;
    overflow:scroll;
    width:400px;
    background:#fafafa;
    margin-top:50px;
}
于 2013-08-24T17:34:32.810 に答える