slideUp only hides? can't show using slideUp

Question

#bannerFijo is a fixed banner display:none at bottom:0px; so to show it I should slideUp() but it seems that this is not working.

<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>

(and it does using show/hide)

 <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>

I tried

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

to show it and I get an error in 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)

Does anybody see an alternative here?

Here is a screenshot of the page for reference.

Answer 1

You might be able to use animate to achieve this, depending on the location and style of the element:

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

Obviously you would need to define desiredHeight and lengthOfAnimation.

Answer 2

Have you tried to just do slideDown to show and slideUp to hide? Even though what you seek is reverse in sense..

When you have element in bottom, and you do slideDown, its a show event with "slide" effect. Since its on bottom, the animation shows in reverse. Atleast to the eye. But its actually sliding down, and because it has hitted the bottom, it raises up.

EDIT: Heres jsFiddle example: http://jsfiddle.net/fddpp/

Answer 3

Try using the slideToggle();

Maybe something like: http://jsfiddle.net/SCgdy/14/