CODEWITHSUNDEEP
javascriptjqueryhtmltwitter-bootstrap
user3675259
user3675259

Reputation: 11

How to apply jQuery effects on Bootstrap pagination

I am using Bootstrap pagination in my design:

<ul class="pagination news-pages">
    <li id="prev" ><a href="javascript:get_pages('0')">&laquo;</a></li>
    <li id="page-1" class="active"><a href="javascript:do_sth('1')">1</a></li>
    <li id="page-2"><a href="javascript:do_sth('2')">2</a></li>
    <li id="next"><a href="javascript:get_pages('3')">&raquo;</a></li>
</ul>

and I'm trying to apply the jQuery .hide() method with sliding effect on it. Just before I change it's content.

function get_pages(start_page)
{
    if(start_page=='0') return false;
    $(".news-pages").hide("slide", {direction:"left"}, "slow");

    /*other ajax stuffs, change displayed page number*/

    return fales;
}

I've tried this code several times but nothing happened. Then, I removed all the arguments passed into .hide().

$(".news-pages").hide();

It works! The component disappeared without any effect. What's wrong with my code?

BTW, I've also tried jQuery effect .toggle() and it is even not working without arguments. Another function I've tried is .fadeOut(), it works perfectly but it's not the effect I want.

Upvotes: 1

Views: 190

Answers (1)

Joe Mike
Joe Mike

Reputation: 1170

Try Something Like this :

function get_pages(start_page)
{
    if(start_page=='0') return false;
      $(".news-pages").hide("slow",function(){
        alert("The paragraph is now hidden");
      });
return false;
    }

Hope it helps...

Upvotes: 1

Related Questions