Question

+++++我加上提及+++++

感谢你们的回答，但是，我想，我错过了写更多的东西。

当我点击按钮显示div（#pop）时，它会在顶部的滚动条上正常工作。

但是，当我向下滚动时，div（#pop）在窗口中上升（高度：0）而不是在“bottom：10％”中，就像在顶部的滚动一样。

所以，我现在正在尝试你的答案，但是，我还没有成功T_T帮助!! ：）

=============================================== ==================================

这是我的代码。

我有一个浮动菜单，其中一个按钮用于显示div id = pop，它也是浮动的。

我想在窗口启动时隐藏div #pop，当点击按钮时，它会显示。

所以我添加了代码display:none来隐藏，但是当我点击按钮显示div #pop时，div #pop就在任何地方，而不是在bottom: 10%的CSS中

HTML

<div class="menu">
    <a href="#scrolltop"><img src="btnUp.png"></a><br/>
        <img src="btnMe.png" id="pop_bt"><br/>
    <a href="#scrollbottom">
        <img src="btnDown.png">
    </a>    
</div>

<div id="pop">
    <div>
        POP UP
    </div>
</div>

CSS

#pop{
    display: none;
    width: 300px;
    height: 400px;
    background: #3d3d3d;
    color: #fff; 
    position: absolute;
    bottom :10%;
    left: 30%;
    z-index: 3;
}

的Javascript

$(document).ready(function(){
    var boxtop = $('.menu').offset().top;
    $(window).scroll(function(){ 
        $('.menu').stop();
        $('.menu').animate({"top": document.documentElement.scrollTop + boxtop}, 800); 
    });  
});

$(document).ready(function() {
    $('#pop_bt').click(function() {
        $('#pop').show();
    });
    $('#pop').click(function() {
        $('#pop').hide();
    });
});

$(document).ready(function(){
    var boxtop = $('#pop').offset().top;
    alert(boxtop);
    $(window).scroll(function(){ 
        $('#pop').stop();
        $('#pop').animate({"top": document.documentElement.scrollTop + boxtop}, 800); 
    });  
});

实际上，我不是程序员，只是设计师，所以我非常愚蠢的HTML / CSS / Javascript。

任何人都可以帮助我吗？

Answer 1

显示无从布局中删除按钮。同样在.hide（）上。使用不透明度0隐藏挖掘但将其保留在浏览器中。

Answer 2

在没有小提琴的情况下，我只能做一些猜测工作。看起来下面的行是问题：

$('#pop').animate({"top": document.documentElement.scrollTop + boxtop}, 800);

设置top值并将图层移动到其他位置。如果删除它，它应该可以正常工作。

Answer 3

使用此...

 $(document).ready(function()
    {
     $("#pop").hide();
    $("#button_id").click(function()
    {
      $("#pop").show();
    });
    });

你真的需要吗？

隐藏的div在显示时会移动

3 个答案: