Javascript 最小化时如何调整浮动条

现在，下面的代码浮动到内容的左侧，向下滚动时可见。到目前为止，只要窗口最大化，一切都正常。但是当它被最小化或者你增加缩放时，我不想让它显示的内容会被显示出来。在这些情况下（最小化窗口和增加缩放），我希望该条粘贴到左边距，这样它就不会显示在内容上。显然，当向下滚动时（如果窗口最大化），该条必须保持向左浮动并可见。我需要做些什么改变来实现这一点？非常感谢您的支持

#pageshare 
{
position:fixed; 
bottom:15%; 
right:10px; 
float:left; 
border: 1px solid #5c5c5c; 
border-radius:5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
background-color:#e5e5e5;
padding:0 0 2px 0;
z-index:10;}

#pageshare .sbutton 
{
float:left;
clear:both;
margin:5px 5px 0 5px;
...
}

---

您可以通过使用JavaScript修改主站点容器和

pageshare

容器的属性来实现这一点。为了简单起见，我使用了

调整站点边距（）

我创建了一个方法，根据

pageshare

容器所需的空间量调整站点边距。首先，此方法计算

pageshare

容器所需的空间量（基于其宽度和左偏移量）和可用空间量（从窗口宽度减去站点宽度，如果为负，则标准化为零）。然后，该方法计算这两个值之间的差值，并将该值应用于站点容器的左边距。这样可以确保

pageshare

容器不会覆盖内容。此外，我设置和删除

scroll

事件处理程序的原因是，否则，当您向左和向右滚动时，

pageshare

容器仍将出现在小窗口的内容上方（）

---

如果没有更多的代码，很难理解这个问题。请添加您的HTML，一个指向实时站点的链接，或者使用重现问题。我在这个问题中添加了javascript标记，因为我不相信只有CSS才能通过跨浏览器实现这一点。哇，这对于一个小条来说太多了，即使一切都解释得很好，我也不明白。干得好，朋友鲁本！（是的también soy latino）所以现在我想我只需要替换代码，但我不知道具体在哪里。。。你能给我指路吗？提前非常感谢，继续做好工作@user2074499您只需要在您的网站中包含JavaScript代码。您可以在网站上了解更多信息。请记住我使用的代码，因此您需要首先包含它！如果这个答案最终帮助你解决问题，请确保接受和/或投票。检查之前在Blogger中找到的代码，因此我认为我必须将其替换为你给我的2个代码。关于jQuery，我想我需要添加它，让它在我的博客中运行。。。在你上次发表评论之前，我添加了你的代码，它说有一个错误（如果发现错误，Blogger不会让你保存更改），这次我需要做很多更改，而没有教程，只是为了调整浮动条。我把它弄乱了两次，并且在试图修复它时真的很难…谢谢你的回答！我真的很感激他们。如果你不介意的话，请检查我的另一个问题，我认为与此相比，这是小菜一碟。我希望你能帮助我。不，维莫斯！

function adjustSiteMarginForPageShare() {
    // Get the window dimensions
    var windowWidth = $(window).width();
    var windowHeight = $(window).height();
    // Get the site width
    var siteWidth = $('#inner-wrapper').outerWidth();
    // Get the pageshare dimensions
    var pageshareWidth = $('#pageshare').outerWidth();
    var pageshareHeight = $('#pageshare').outerHeight();
    // Get the pageshare left offset
    var pageshareLeft = $('#pageshare').offset().left;

    // Calculate the needed pageshare space
    var pageshareSpaceNeeded = pageshareWidth + pageshareLeft;
    // Calculate the available pageshare space (division because of centering)
    var pageshareSpaceAvailable = (windowWidth - siteWidth) / 2;
    // Ensure the minimum available pageshare space as zero
    pageshareSpaceAvailable = (pageshareSpaceAvailable > 0) ? pageshareSpaceAvailable : 0;

    // If the pageshare space available is less than what is needed
    if (pageshareSpaceAvailable <= pageshareSpaceNeeded) {
        // Calculate the left margin needed as the difference between the two
        var leftMarginNeeded = pageshareSpaceNeeded - pageshareSpaceAvailable;

        // Add the left margin needed to the site
        $('#inner-wrapper').css('margin-left', leftMarginNeeded);

        // Modify the pageshare style
        $('#pageshare').css({
            'position': 'absolute'
        });

        // Set the pageshare scroll behavior
        $(window).off('scroll.pageshare');
        $(window).on('scroll.pageshare', function() {
            // Set the bottom to top conversion factor (100% total height - 15% bottom offset = 85% top offset)
            var conversionFactor = 0.85;
            // Calculate the top offset based on the conversion factor and the pageshare height
            var pageshareTopOffset = (conversionFactor * windowHeight) - pageshareHeight;
            // Adjust the pageshare top offset by the current scroll amount
            pageshareTopOffset += $(window).scrollTop();

            $('#pageshare').css({
                'top': pageshareTopOffset + 'px',
                'bottom': 'auto'
            });
        });

        // Trigger the pageshare scroll handler
        $(window).triggerHandler('scroll.pageshare');
    } else {
        // Reset the pageshare style
        $('#pageshare').css({
            'position': 'fixed',
            'top': 'auto',
            'bottom': '15%'
        });

        // Turn off the pageshare scroll behavior
        $(window).off('scroll.pageshare');
    }
}

// Adjust the content margin for pageshare container on load
adjustSiteMarginForPageShare();

// When the window is resized
$(window).resize(function () {
    // Adjust the content margin for the pageshare container
    adjustSiteMarginForPageShare();
});