0

ユーザーがスクロールできるように、内部に複数のdivを持つdivがあります。それはトグルです - ボタンのクリックで表示/非表示。

HTML:

<div id="mainDiv">
    <div class="innerDiv" id="one"></div>
    <div class="innerDiv" id="two"></div>
    <div class="innerDiv" id="three"></div>
    <div class="innerDiv" id="four"></div>
    <div class="innerDiv" id="five"></div>
    <div class="innerDiv" id="six"></div>
    <div class="innerDiv" id="seven"></div>
    <div class="innerDiv" id="eight"></div>
    <div class="innerDiv" id="nine"></div>
    <div class="innerDiv" id="ten"></div>
</div>

<a href="javascript:void(0)" id="opnLnk">Open Popup</a>
<a href="javascript:void(0)" id="clsLnk">Close Popup</a>

CSS:

#mainDiv {width:300px; height:350px; border:1px solid #000; background-color:palegreen; overflow-x:hidden; overflow-y:auto}
.innerDiv {width:298px; border:1px solid green; height:50px}
#three {background-color:red}
.innerDiv:nth-child(odd) {background-color:green}
.innerDiv:nth-child(even) {background-color:blue}
#opnLnk, #clsLnk {right:30px; right:30px; position:absolute}
#opnLnk {top:30px}
#clsLnk {top:70px}

JS:

$("#opnLnk").click(function(){
    // need a script to always show red div
    $("#mainDiv").show();
});

$("#clsLnk").click(function(){
    $("#mainDiv").hide();
});

フィドル: http://jsfiddle.net/PSSdC/

ユーザーが一番下までスクロールすると、ポップアップが閉じられ、再び開きます。私が欲しいのは、ポップアップが常に開かれているときに、常に一番上の行に赤い（#three）divを表示することです

私はすでに jquery scrollTop メソッドを試しましたが、ajax コンテンツが読み込まれているため、いくつかの回避策が必要です。

4

2 に答える 2

1

scrollToElementjsに関数を追加します。

function scrollToElement(ele) {
$("#mainDiv").scrollTop(ele.offset().top).scrollLeft(ele.offset().left);
}


作業フィドル: http://jsfiddle.net/PSSdC/4/

于 2013-09-16T12:21:52.243 に答える
0

トグル完了イベントの後、divを一番上にスクロールする必要があります。

$("#clkLnk").click(function(){
    // need a script to always show red div
    $("#mainDiv").toggle("slow",function(){
         $("#mainDiv").scrollTop(0);
    });
});

作業例：
jsFiddle

于 2013-09-16T12:15:19.693 に答える