Question

I'm using the infinite scrolling for the search result page. The problem I'm having is that when you do a search for something like 'Android', the word is highlighted in the results you see on the first page, but if you scroll to the bottom of the page and see more results, those entries do not have the search term highlighted. So the pages which are loaded with infinite scrolling have no the search terms highlighted. The script for highlighting is here

$(document).ready(function() {
            jQuery.ias({
                container : '.articles',
                item: '.article',
                pagination: '#pagination',
                next: '.next_page',
        triggerPageThreshold: 1003,
                loader: '<img src="loader.gif"/>'

            });     

        });    

to execute the highlight:

$('p').highlight('android');

in firebug it works fine when I run the script. How can I implemmented inside of the infinite scrolling so it's triggered with it?

Was it helpful?

Solution

this will do it

$(document).scroll(function(){
        var el = $('body');
        var top = $(el).offset().top - $(document).scrollTop();
        if (top < 5){
        var term = $('#q').val();
          $('p').highlight(term);
        }        
      });
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top