image slide left to right bottom of the corner jquery

848 views Asked by At

I am trying to slide image left to right bottom of the corner.

I am using this code but js not supported (direction ) paramerer..

<script type="text/javascript">
    $(window).load(function () {            
        $("#man").show("slide", {
        direction: "down"
    }, 2000);


    });
</script>
<style type="text/css">
    #man {
        display: none;
        position: fixed;
        bottom: 0px;
        right: 0px;
    }
</style>
3

There are 3 answers

0
Mohamed-Yousef On

you can use .animate() with max-height

<script type="text/javascript">
    $(document).ready(function () {            
         $("#man").animate({
            'max-height': "500px"
        }, 2000);
    });
</script>
<style type="text/css">
    #man {
        /*display: none;*/ no need 
        position: fixed;
        bottom: 0px;
        right: 0px;
        max-height : 0px;
    }
</style>

DEMO

0
wrxsti On

The slideToggle method does this pretty easily.

DEMO

HTML

<div id="man"></div>

jQuery

$(function(){
     $("#man").slideToggle(500);
});

CSS

#man {
    display: none;
    position: fixed;
    bottom: 0px;
    right: 0px;
    width: 200px;
    height: 400px;
    background: grey;
}
0
jigar Patel On
<script src="jquery-1.7.1.js"></script>
    <script src="jquery-ui-1.8.20.js"></script>
    <script type="text/javascript">

        $(window).load(function () {
            $("#man").show("slide", {
                direction: "Down"
            }, 2000);
        });

    </script>

    <style type="text/css">
        #man {
            display: none;
            position: fixed;
            bottom: 0px;
            right: 0px;
        }
    </style>