slideUp only hides? can't show using slideUp

Toni Michel Caubet picture Toni Michel Caubet · Aug 19, 2011 · Viewed 7.7k times · Source

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

image

Answer

Pehmolelu picture Pehmolelu · Aug 19, 2011

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/