CODEWITHSUNDEEP
javascriptjqueryhtml
Reg T
Reg T

Reputation: 55

Jquery, select and scroll next element

I've got a newbie jQuery question. I need to add a number of tiny text boxes with links to scroll up and down any overflowed content.

I've got it to work as follows, but need to rework it to handle repeated boxes of text on the page.

Javascript..

$(function() {
    $('a.scrolldown').click(function(event) {   
    event.preventDefault();
    $(".mytextbox").scrollTop($(".mytextbox").scrollTop() - 20);
    });
});

With the markup...

<div class="news_col">
    <p class="newscontrols">
     <a class="scrolldown" href="#">down </a><a class="scrollup" href="#">up</a></p>
     <div class="news_item_text mytextbox">
      <p>Loren ipsum...</p>
     </div>
</div>

I realise I could use maybe the 'next' selector but need a bit of help rewriting it.

Upvotes: 1

Views: 185

Answers (1)

Adil
Adil

Reputation: 148110

You can use next() with $(this) to access the textbox after the .scrolldown anchor.

$(function() {
    $('a.scrolldown').click(function(event) {   
       event.preventDefault();
       $mytextbox = $(this).next(".mytextbox");
       $mytextbox.scrollTop($mytextbox.scrollTop() - 20);
    });
});

Upvotes: 1

Related Questions