ホームページ >ウェブフロントエンド >htmlチュートリアル >div スクロール bar_html/css_WEB-ITnose について質問があります。
代码如下:
76c82f278ac045591c9159d381de2c57
100db36a723c770d327fc0aef2ce13b1
93f0f5c25f18dab9d176bd4f6de5d30e
03fc48c6e8e131d94ca98b8e034341f4
4e0acc4a468b953e95b6084941208f232cacc6d41bbb37262a98f745aa00fbf0
b2386ffb911b14667cb8f0f91ea547a7CDOS Mail6e916e0f7d1e588d4f442bf645aedb2f
46d5fe1c7617e3914f214aaf043f4ccf
#outOne {
width:30%;
height:80%;
background-color:gray;
overflow:auto;
}
#innerOne {
width:20%;
height:20%;
background-color:blue;
overflow:auto;
}
531ac245ce3e4fe3d50054a55f265927
9c3bca370b5104690d9ef395f2c5f8d1
6c04bd5ca3fcae76e30b72ad730ca86d
3f1c4e4b6b16bbbd69b2ee476dc4f83a
$(document).ready(function() {
$(".newfolder").show();
$(".rcvfold").click(function(){
$('.newfolder').slideToggle(500);
})
});
2cacc6d41bbb37262a98f745aa00fbf0
61bf34bdfed1f43af8364ca44ad55893
2b31ad4653e75e68dc5aecf5fa83d17e欢迎新用户556c2c322c68b6e0f9414b7e606e9be472ac96585ae54b6ae11f849d2649d9e6c72c1af5e0e7f90179c047c5ef85885e
f5e450e3490c6f491f20f57767b34860收件箱556c2c322c68b6e0f9414b7e606e9be472ac96585ae54b6ae11f849d2649d9e61faa8c67643450774912653a7864f7940ca7815e485429058ba314482e7502bf82e295699cff932a4d4dabba39074c35
4d985482345ba6e7b1eab44769485c8d
b47a148003b034b1cfe8e90284a060detest182e295699cff932a4d4dabba39074c35
b47a148003b034b1cfe8e90284a060detest282e295699cff932a4d4dabba39074c35
b47a148003b034b1cfe8e90284a060detest382e295699cff932a4d4dabba39074c35
b47a148003b034b1cfe8e90284a060detest482e295699cff932a4d4dabba39074c35
b47a148003b034b1cfe8e90284a060detest582e295699cff932a4d4dabba39074c35
b47a148003b034b1cfe8e90284a060detest182e295699cff932a4d4dabba39074c35
b47a148003b034b1cfe8e90284a060detest282e295699cff932a4d4dabba39074c35
b47a148003b034b1cfe8e90284a060detest382e295699cff932a4d4dabba39074c35
b47a148003b034b1cfe8e90284a060detest482e295699cff932a4d4dabba39074c35
b47a148003b034b1cfe8e90284a060detest582e295699cff932a4d4dabba39074c35
b47a148003b034b1cfe8e90284a060detest182e295699cff932a4d4dabba39074c35
16b28748ea4df4d9c2150843fecfba68
31de59b41f0936c94f9c17e910693447testaaaa aasdasdasdsdas94b3e26ee717c64999d7867364b1b4a3
e388a4556c0f65e1904146cc1a846beetestaaaaaasdasdasdsdas94b3e26ee717c64999d7867364b1b4a3
36cc49f0c466276486e50c850b7e4956
div 内に div を作成します。 外側の div には、内側の div のコンテンツを展開/縮小するためのボタンがあります。 本来、達成される効果は次のとおりです。 test1~4 の 4 行のコンテンツ、まだコンテンツがある場合は、スクロール バーが表示されます。
ここでの問題は、最初の文 8b05045a5be5764f313ed5b9168a17e6 を追加すると、スクロール バーが垂直方向に表示されないことです。内側の div ですが、水平方向には効果がありません。コンテンツが多すぎると、ページの一番下に移動してしまい、最初の文をログアウトすると表示されなくなります。8b05045a5be5764f313ed5b9168a17e6 、次に内側の div スクロール バーが表示されますが、ボタンをクリックして縮小すると、内側の div の内容は縮小しますが、境界線はまだそこにあります
ソリッドで 2 つの状況の組み合わせを変更する方法を教えてください線、つまり、ボタンをクリックして実線をプルダウンすると、スクロールバーが表示されます。もう一度 div ボタンをクリックして全体をプルアップします。ありがとうございます
ディスカッション (解決策) への返信
最初の文にコメントした後の拡張効果:
$(document).ready(function() { $("#innerOne .newfolder").show(); $(".rcvfold").click(function(){ $('#innerOne').slideToggle(500); }) });
$(document).ready(function() { $("#innerOne .newfolder").show(); $(".rcvfold").click(function(){ $('#innerOne').slideToggle(500); }) });
ありがとうございます