Question

I have an div element with class panel. What I want is when I click an anchor tag with class open then it should show a div container with class panel and slide it down.

In my current code I have two links with class open. When I click any of them then it animates the panel. But when I click the bottom anchor tag then I cannot see the element until I scroll up.

How can I make this animation possible so that which ever link I click anywhere on page then I must see panel to be animated and shown?

Here is my code is here

Answer 1

2 ways come to my mind,

first: u set panel’s CSS position:fixed; than user can see panel from everywhere,

this is DEMO

or second way: u set multiple conditionals functions for each click

 $('.openTop').click(function(e) {
          e.preventDefault();
          $('.panel').animate({top:'300'},500).show();
 });
 $('.openBottom').click(function(e) {
          e.preventDefault();
          $('.panel').animate({top:'1000'},500).show();
});