How can i show a jquery menu which opens from right to left side?

155 views Asked by At

I want to show a menu on clicking on a link. The menu should appear from right to left with show function. I have already tried $('.amenu').show("slide", { direction: "right" }, "fast"); But it comes sliding. I want the same effect as $('.amenu').show("fast"); but menu originating from top right corner.

1

There are 1 answers

0
VladNeacsu On

I've made this fiddle for you which you can use in any way. The idea is that the menu is put in position with this css:

position: absolute;
top: 0;
right: 0;

If you play around you can make it stick anywhere. The animation is also done with CSS using this class and you can leave only width if you want a slide animation:

.animate {
  height: 100px;
  width: 300px;
  transition: width 1s, height 1s;
  -moz-transition: width 1s, height 1s;
  -webkit-transition: width 1s, height 1s; 
  -o-transition: width 1s, height 1s; 
}

And a simple jQuery to toggle the class.

https://jsfiddle.net/mtucpL3v/

Further reading: CSS transitions