amitabhaghosh197
amitabhaghosh197

Reputation: 61

jQuery transit animation not working properly

I am just new to jquery. I have just followed a link http://ricostacruz.com/jquery.transit/

where I found a transit animation just moving a div from left to right on just hovering the mother div and I have done all the process as instructed thereon.

My Codes are as follows:

Script:

$('#div1').hover(
    function () {

        $('#div2').transition({ x: '90px' });


    });

The Css:

#div1{width:150px;
height:100px;
position:relative;
background:#9F0;}

   #div2
   {
       width:50px;
       height:50px;
       background:
       #F00;}

The HTML

<div id="div1"></div><div id="div2"> </div>

You can view it here

I think that I am going wrong. Please help me to sort it out. Thanks in advance.

Upvotes: 0

Views: 2233

Answers (2)

Ram
Ram

Reputation: 144689

you should position the div absolutely, try this:

http://jsfiddle.net/8RMNU/1/

Upvotes: 0

rgin
rgin

Reputation: 2311

Yeah. First of all, your fiddle isn't including the jQuery Transit plugin nor is it set to using jQuery in the first place. It's on mootools.

Second, that's not how you use it. The site clearly says $('.parent').transition({<parameters}).

I suggest you read up on how to use jQuery first as this seems to be the main problem. I suggest you start here: http://docs.jquery.com/How_jQuery_Works

Good luck.

Upvotes: 1

Related Questions