CODEWITHSUNDEEP
javascriptphpjqueryhtmlwordpress
pocockn
pocockn

Reputation: 2063

Animate to target only on second page load

I have created a WordPress site that displays a list of posts. I created a div with the id of archive-tracks, then I use some jQuery that scrolls the page down to that div when the page is loaded.

I want this functionality to only happen when one of my pagination links is clicked, at the moment it happens as soon as someone enters the page on the site.

Here is my JS

jQuery(function(){
  var target = "archive-tracks";
  jQuery('html, body').animate({
    scrollTop: jQuery('#'+target).offset().top
  }, 1500,'swing');
  return false;
});

Is there a way of stopping this animation if the user comes from an external page but then allowing it when they click one of my pagination links to go through my posts?

Here is my pagination code. 

function dem_pagination( $pages = '', $range = 2 ) {
  $showItems = ($range * 2)+1;
  global $paged;

  if (empty($paged)) $paged = 1;

  if ($pages == '') {
    global $wp_query;
    $pages = $wp_query->max_num_pages;
    if (!$pages) {
      $pages = 1;
    }
  }

  if ( $pages != 1 ) {
    echo "<div class='pagination'>";

    if ($paged > 2 && $paged > $range+1 && $showItems < $pages) {
      echo "<a href='".get_pagenum_link(1). '#latest' . "'>&laquo;</a>";
    }

    if ($paged > 1 && $showitems < $pages) {
      echo "<a href='".get_pagenum_link($paged - 1). '#latest' ."'>&lsaquo;</a>";
    }

    for ($i=1; $i <= $pages; $i++) {
      if (1 != $pages &&( !($i >= $paged+$range+1 || $i <= $paged-$range-1) || $pages <= $showitems )) {
        echo ($paged == $i)? "<span class='current'>".$i."</span>":"<a href='".get_pagenum_link($i). '#latest' ."' class='inactive' >".$i."</a>";
      }
    }

    if ($paged < $pages && $showitems < $pages) echo "<a href='".get_pagenum_link($paged + 1). '#latest' . "'>&rsaquo;</a>";
    if ($paged < $pages-1 &&  $paged+$range-1 < $pages && $showitems < $pages) echo "<a href='".get_pagenum_link($pages). '#latest' ."'>&raquo;</a>";

    echo "</div>\n";
  }
}

Upvotes: 0

Views: 34

Answers (1)

Jai
Jai

Reputation: 74738

Not sure but you can use this: 

jQuery(function(){
    if(window.location.hash){ //<------if hash values are location then only executes
       var target = "archive-tracks";
       jQuery('html, body').animate({
           scrollTop: jQuery('#'+target).offset().top
       }, 1500,'swing');
       return false;
    }
});

Upvotes: 2

Related Questions