Sorry I think it has to be:
$('.page:visible').hide().prev('.page').show();
and
$('.page:visible').hide().next('.page').show();
Or is the second class selection not necessary?
On Feb 26, 8:33 pm, Frederik Ring <frederik.r...@gmail.com> wrote:
> Why don't you just do it like:
>
> $('#prev').css('cursor','pointer').click(function(){
> $('.page:visible').hide().prev().show();
>
> }
>
> Same with next.
>
> $('#next').css('cursor','pointer').click(function(){
> $('.page:visible').hide().next().show();
>
> }
>
> You will pro
>
> On Feb 26, 5:43 pm, Doug C <lietmo...@gmail.com> wrote:
>
> > I wrote this jquery to basically dynamically build a paging control
> > for long articles, etc....
> > I have it dynamically generating a UL, a page selector and a drop
> > down
> > selector and I just need to write a piece that will do a <-Prev and
> > Next -> and my brain is having trouble with it. Here is the code in
> > simplified form. I also don't have the coding for the contect
> > highlighting done yet to show what page we are on.
>
> > HTML:
> > <div id="headerUL"><!--UL goes here--></div>
> > <div id="page1" class="page" title="Section 1">This is Page 1</div>
> > <div id="page2" class="page" title="Section 2">This is Page 2</div>
> > <div id="page3" class="page" title="Section 3">This is Page 3</div>
> > <div id="page4" class="page" title="Section 4">This is Page 4</div>
> > <div id="prev"><!--This will be the Prev Link--></div>
> > <div id="PageNum"><!-- Page Numbers 1, 2, 3, 4--></div>
> > <div id="next"><!--This will be the Next Link--></div>
> > <div id="DropDown"><!--Drop down box--></div>
> > Here is the Jquery I have that generates it. I just need some help
> > getting Prev and Next done.
> > <script>
> > $(document).ready(function(){
> > //Prestate
> > $(".page:not(:first)").hide();
> > $(".page:first").show();
> > //Let's get the # of pages.
> > var numPages = $(".page").length;
> > var pageNums= "";
> > var prev = "", next="";
> > var i = 1;
> > var lister = "<UL id=pageUL>";
> > var selector = "<select id=pageSelect>";
> > $(".page").each(function(i) {
> > pageNums+= "<a href=# id="+this.id+" class=pageids>"+(i+1)+",</
> > a> "
> > lister+="<LI><a href=# class=pageLI>"+$("#"+this.id).attr('title')
> > +"</
> > a></LI>"
> > selector+="<option class=pageSE value="+$("#"+this.id).attr('title')
> > +">"+$("#"+this.id).attr('title')+"</option>"
>
> > });
>
> > lister+="</UL>";
> > selector+="</select>";
> > //Add the Click events
> > $(".pageids").live("click", function(){
> > $("#"+this.id).show();
> > $(".page:not(#"+this.id+")").hide();
>
> > });
>
> > $(".pageLI").live("click",function(){
> > var ht = $(this).html()
> > $(".page").hide();
> > $("DIV[title='"+ht+"']").show();
> > });
> > $(".pageSE").live('click',function(){
> > var ht = $(this).text();
> > $(".page").hide();
> > $("DIV[title='"+ht+"']").show();
> > });
> > //Set the values
> > $("#PageNum").html(pageNums);
> > $("#headerUL").html(lister);
> > $("#DropDown").html(selector);
>
> > });
>
> > </script>
> > Thanks in advance.
>
>
