javascript - 如何在文章网站的特定行上创建弹出窗口？

Question

谁能帮帮我？

我需要为特定行创建弹出窗口。

如果用户正在阅读文章并且已经阅读到文章中间，则会出现一个弹出窗口，如果返回顶部，则弹出窗口将被隐藏。

这是我弹出的源代码

$(".news").css("width","100%");
$(document).ready(function(){
    if($("#blanket").length==1){
        if($("#popUpDiv2").length==1){
            popup('popUpDiv2');
        }
        else{
            popup('popUpDiv');
        }
    }
    checkCookie('popUpDiv');
    $('#popUpDiv').removeAttr('style');     
    $('#popUpDiv').css({left: 20, bottom: 25}); 

});

#blanket {width: 10px;background-color:#fff;opacity:0;position:fixed;z-index:9001;top:0px;left:0px;/*width:100%;*/}
#popUpDiv {position:fixed;background:url('../image/Pop-Up-Banner-NOS-6000-Vermillion.png') no-repeat;width:275px;height:275px;z-index:9002;background-size: 275px auto;}
.trbox{width:270px;height:270px;bottom: 0px;left: 0px;}
#popUpDiv a,#popUpDiv2 a {width:45px;height:10px;padding: 2px 35px;position:relative;bottom: 29px;left:103px;}/*fix jangan diutak atik*/
.closepopup2{position: absolute;cursor: pointer;font-weight: bold;color: #fff;width:20px;height:2px;padding: 5px 10px;float:right;bottom: 232px;right:1px;} /*fix jangan diutak atik*/

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
div id="popup"></div>
<div id="blanket" style="display:none;"></div>
<div id="popUpDiv" style="display:none;"><div class="trbox">&nbsp;</div>
    <a target="_blank" href=""></a>
    <div onclick="popup('popUpDiv')" class="closepopup2"></div>
    <!-- <div class="popUpbottom">
        <div class="comboAlert"><input type="checkbox" name="checkboxAlert" id="checkboxAlert"> Don't show again Today</div>
    </div> -->
</div>

Answer 1

对于要用作弹出窗口触发器的行，您必须执行以下操作。

假设它是一个div。在 scoll 事件上计算 div 的 scollTop。当 scollbar 位置等于 div 的 scrollTop 时，显示弹出窗口。

见下面的链接， How to get scrollbar position with Javascript? http://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_prop_element_offsettop