slideUp 只隐藏？无法使用 slideUp 显示答案

【问题标题】：slideUp only hides? can't show using slideUpslideUp 只隐藏？无法使用 slideUp 显示
【发布时间】：2013-12-13 19:51:24
【问题描述】：

#bannerFijo 是display:none bottom:0px; 上的固定横幅，所以要显示它我应该 slideUp() 但似乎这不起作用。

<script type="text/javascript">
    function mostrar_banner() {
        $('#bannerFijo').slideUp();
    }
    function ocultar_banner(){
        $('#bannerFijo').slideDown();
    }
    $(document).ready(function() {
        mostrar_banner();

        $('#bannerFijo .close').click(function() {
            ocultar_banner();
        });
    });
</script>

（它确实使用显示/隐藏）

 <script type="text/javascript">
    function mostrar_banner() {
        $('#bannerFijo').show();
    }
    function ocultar_banner(){
        $('#bannerFijo').hide();
    }
    $(document).ready(function() {
        mostrar_banner();

        $('#bannerFijo .close').click(function() {
            ocultar_banner();
        });
    });
</script>

我试过了

$('#bannerFijo').show("slide", { direction: "up" });

显示它，我在jquery.min.js 中收到错误。

o.easing[this.options.easing || (o.easing.swing ? "swing" : "linear")] is not a function  
[Detener en este error] (function(){var R=/((?:\((?:\([^()]+\)...ypeof K==="string"?K:K+"px")}})})();
jquery....min.js (línea 31)

有人在这里看到替代品吗？

这是页面截图供参考。

【问题讨论】：

slideUp 只会隐藏：api.jquery.com/slideUp，您不能向上滑动显示，只能向下滑动。下面的建议可能是更好的选择
请查看我的回答并说出其中哪一部分不起作用或不适合作为解决方案

标签： jquery show slideup

【解决方案1】：

您是否尝试过仅使用 slideDown 来显示和 slideUp 来隐藏？即使你所寻求的东西在意义上是反向的..

当您在底部有元素并且您执行 slideDown 时，它是一个具有“幻灯片”效果的显示事件。由于它位于底部，因此动画反向显示。至少入眼。但它实际上是向下滑动的，因为它触到了底部，所以它会上升。

编辑：这是 jsFiddle 示例：http://jsfiddle.net/fddpp/

【讨论】：

如果您检查图像；当它首先滑动时，您会看到图像的底部，它显示的最后一件事是“礼物盒”，需要相反:(
@Toni，所以你检查了吗？或者只是因为函数名而这么认为？底部的 slideDown 实际上是显示出来的“slideUp”。
是的，我做到了，但正如我告诉你的那样，它并没有真正给人以动画顶部/底部而是高度的感觉......我需要看看礼品盒（来自我的图片问题）首先；还是非常感谢:)

【解决方案2】：

您也许可以使用animate 来实现这一点，具体取决于元素的位置和样式：

$('#bannerFijo').animate({ height: desiredHeight }, lengthOfAnimation, function() {
    //executes on completion
});

显然您需要定义desiredHeight 和lengthOfAnimation。

【讨论】：

div 位置：固定；底部：0px；显示：无；我会玩这个，让你知道。你认为我应该代替 display:none;从底部开始：-100px；然后动画？
@Toni Michel Caubet：嗯，直接使用animate 有很多可能性，因为您可以更改 CSS 并以自定义方式操作属性（例如，你可以做bottom: desiredBottom 或者几乎改变任何CSS属性），所以我建议你按照你说的稍微玩一下，看看有什么用。 :)
试过你发布的动画线，改变高度->底部（从-100px到0px）但它不起作用。知道为什么吗？？
请忽略，问题是我没有删除显示：无：\
@Toni Michel Caubet：部分是我的错，我应该将它包含在示例中 - 很高兴你已经解决了。

【解决方案3】：

尝试使用 slideToggle();

可能类似于：http://jsfiddle.net/SCgdy/14/

【讨论】：

我喜欢这个；但问题是元素是 {display:none} 并且我想在 document.ready 上看到它......这个选项可以满足这个要求吗？谢谢！！！
好吧，编辑了我的问题，以便您了解为什么 slideToggle 在这里无效。如果您检查图像；当它首先滑动时，您会看到图像的底部，它显示的最后一件事是“礼物盒”，需要相反:(
我明白了。它看起来像这样，因为它被定位到底部，所以从底部开始生长。然而，解决这个问题的一种方法是使用一个简单的 HTML/CSS 技巧。不是最漂亮的代码，但类似于：jsfiddle.net/coxrichuk/q37ur/2