使用jQuery Show/Hide met时内容滑动错误

我对jQuery显示/隐藏方法有一种奇怪的行为

我有一个向右浮动的div（css Float:right）

如果我试图显示/隐藏的这个div不是固定的（css位置：fixed），那么这些方法可以正常工作

但在滚动页面并将div固定到位后，当我将其隐藏时，面板会向右隐藏，但此面板的内容会向左隐藏

以下是HTML：

<div class="BotonRecursos" id="BotonRecursos"><img src="next-icon.png" width="32" height="32" id="Image7"/></div>
<div class="bloaqueCompleto">
    <div class="bloaqueIzq float_Izq" id="bloaqueIzq">
        <p>Paragraph</p>
        <p>Paragraph</p>
        <p>Paragraph</p>
        <p>Paragraph</p>
        <p>Paragraph</p>
        <p>Paragraph</p>
        <p>Paragraph</p>
        <p>Paragraph</p>
        <p>Paragraph</p>
        <p>Paragraph</p>
        <p>Paragraph</p>
        <p>Paragraph</p>
        <p>Paragraph</p>
        <p>Paragraph</p>
        <p>Paragraph</p>
    </div>
    <div class="bloaqueDer float_Der" id="bloaqueDer">
      <ul>
        <li>Listitem</li>
        <li>Listitem</li>        
        <li>Listitem</li>
        <li>Listitem</li>
        <li>Listitem</li>
      </ul>
    </div>
</div>

最后是我调用的JQuery方法

$(document).ready(function () {

    // ***** Iamgen ocultar/mostrar panel de recursos *****
    var state = true;
    var sidebarWidth = $("#bloaqueDer").width();

    $("#Image7").click(function () {

        if (state) {
            $("#bloaqueIzq").animate({ width: "+=" + sidebarWidth + "px" }, 1000);
            $("#bloaqueDer").hide(1000, function () {
                $("#Image7").attr("src", "prev-icon.png");
            });
        } else {
            $("#bloaqueIzq").animate({ width: "-=" + sidebarWidth + "px" }, 1000);
            $("#bloaqueDer").show(1000, function () {
                $("#Image7").attr("src", "next-icon.png");
            });
        }

        state = (state) ? false : true;

    });

});

$(document).ready(function () {
    // check where the shoppingcart-div is  
    var offset = $('#bloaqueDer').offset();
    $(window).scroll(function () {
        var scrollTop = $(window).scrollTop();
        // check the visible top of the browser     
        if (offset.top < scrollTop) {
            $('#bloaqueDer').addClass('fixedP');
        } else {
            $('#bloaqueDer').removeClass('fixedP');
        }
    });
});

$(document).ready(function () {
    // check where the shoppingcart-div is  
    var offset = $('#BotonRecursos').offset();
    $(window).scroll(function () {
        var scrollTop = $(window).scrollTop();
        // check the visible top of the browser     
        if (offset.top < scrollTop) {
            $('#BotonRecursos').addClass('fixedB');
        } else {
            $('#BotonRecursos').removeClass('fixedB');
        }
    });
});

$（文档）.ready（函数（）{
//****Iamgen ocultar/mostrar recursos小组*****
var状态=真；
var sidebarWidth=$（“#bloaqueDer”）.width（）；
$（“#图像7”）。单击（函数（）{
如果（州）{
$（“#bloaqueIzq”）.animate（{width:“+=”+sidebarWidth+“px”}，1000）；
$（“#bloaqueDer”）.hide（1000，函数（）{
$（“#Image7”）.attr（“src”、“prev icon.png”）；
});
}否则{
$（“#bloaqueIzq”）.animate（{width:“-=”+sidebarWidth+px}，1000）；
$（“#bloaqueDer”）.show（1000，函数（）{
$（“#Image7”）.attr（“src”，“next icon.png”）；
});
}
状态=（状态）？假：真；
});
});
$（文档）.ready（函数（）{
//检查shoppingcart分区的位置
var offset=$（'#bloaqueDer'）.offset（）；
$（窗口）。滚动（函数（）{
var scrollTop=$（窗口）.scrollTop（）；
//检查浏览器的可见顶部
if（offset.top

您可以在我在网站上主持的这个测试中看到这种行为 网站。（绿色箭头显示并隐藏面板）

---

任何帮助都将不胜感激

请在此处添加有意义的代码和问题描述。不要只是链接到需要修复的站点——否则，一旦问题解决或者你链接到的站点无法访问，这个问题将对未来的访问者失去任何价值。发布一个能证明你的问题的帖子会帮助你得到更好的答案。有关更多信息，请参阅“谢谢！”。帖子更新，谢谢你的建议。

$(document).ready(function () {

    // ***** Iamgen ocultar/mostrar panel de recursos *****
    var state = true;
    var sidebarWidth = $("#bloaqueDer").width();

    $("#Image7").click(function () {

        if (state) {
            $("#bloaqueIzq").animate({ width: "+=" + sidebarWidth + "px" }, 1000);
            $("#bloaqueDer").hide(1000, function () {
                $("#Image7").attr("src", "prev-icon.png");
            });
        } else {
            $("#bloaqueIzq").animate({ width: "-=" + sidebarWidth + "px" }, 1000);
            $("#bloaqueDer").show(1000, function () {
                $("#Image7").attr("src", "next-icon.png");
            });
        }

        state = (state) ? false : true;

    });

});

$(document).ready(function () {
    // check where the shoppingcart-div is  
    var offset = $('#bloaqueDer').offset();
    $(window).scroll(function () {
        var scrollTop = $(window).scrollTop();
        // check the visible top of the browser     
        if (offset.top < scrollTop) {
            $('#bloaqueDer').addClass('fixedP');
        } else {
            $('#bloaqueDer').removeClass('fixedP');
        }
    });
});

$(document).ready(function () {
    // check where the shoppingcart-div is  
    var offset = $('#BotonRecursos').offset();
    $(window).scroll(function () {
        var scrollTop = $(window).scrollTop();
        // check the visible top of the browser     
        if (offset.top < scrollTop) {
            $('#BotonRecursos').addClass('fixedB');
        } else {
            $('#BotonRecursos').removeClass('fixedB');
        }
    });
});