[Александр83]

// Блок № 1 наведение на ссылку перехода по якорю

<table class="tab_01" width="100%" height="100%">
  <tr>
    <td width="5.88%"><?php echo '<a href="#'.$dataItem->tab_001.'" class="'.$dataItem->tab_001.'">' .$dataItem->tab_001. '</a>'; ?></td>
    <td width="5.88%"><?php echo '<a href="#'.$dataItem->tab_002.'" class="'.$dataItem->tab_002.'">' .$dataItem->tab_002. '</a>'; ?></td>
    <td width="5.88%"><?php echo '<a href="#'.$dataItem->tab_003.'" class="'.$dataItem->tab_003.'">' .$dataItem->tab_003. '</a>'; ?></td>
    <td width="5.88%"><?php echo '<a href="#'.$dataItem->tab_004.'" class="'.$dataItem->tab_004.'">' .$dataItem->tab_004. '</a>'; ?></td>
    <td width="5.88%"><?php echo '<a href="#'.$dataItem->tab_005.'" class="'.$dataItem->tab_005.'">' .$dataItem->tab_005. '</a>'; ?></td>
    <td width="5.88%"><?php echo '<a href="#'.$dataItem->tab_006.'" class="'.$dataItem->tab_006.'">' .$dataItem->tab_006. '</a>'; ?></td>
    <td width="5.88%"><?php echo '<a href="#'.$dataItem->tab_007.'" class="'.$dataItem->tab_007.'">' .$dataItem->tab_007. '</a>'; ?></td>
    <td width="5.88%"><?php echo '<a href="#'.$dataItem->tab_008.'" class="'.$dataItem->tab_008.'">' .$dataItem->tab_008. '</a>'; ?></td>
    <td width="5.88%"><?php echo '<a href="#'.$dataItem->tab_009.'" class="'.$dataItem->tab_009.'">' .$dataItem->tab_009. '</a>'; ?></td>
    <td width="5.88%"><?php echo '<a href="#'.$dataItem->tab_010.'" class="'.$dataItem->tab_010.'">' .$dataItem->tab_010. '</a>'; ?></td>
    <td width="5.88%"><?php echo '<a href="#'.$dataItem->tab_011.'" class="'.$dataItem->tab_011.'">' .$dataItem->tab_011. '</a>'; ?></td>
    <td width="5.88%"><?php echo '<a href="#'.$dataItem->tab_012.'" class="'.$dataItem->tab_012.'">' .$dataItem->tab_012. '</a>'; ?></td>
    <td width="5.88%"><?php echo '<a href="#'.$dataItem->tab_013.'" class="'.$dataItem->tab_013.'">' .$dataItem->tab_013. '</a>'; ?></td>
    <td width="5.88%"><?php echo '<a href="#'.$dataItem->tab_014.'" class="'.$dataItem->tab_014.'">' .$dataItem->tab_014. '</a>'; ?></td>
    <td width="5.88%"><?php echo '<a href="#'.$dataItem->tab_015.'" class="'.$dataItem->tab_015.'">' .$dataItem->tab_015. '</a>'; ?></td>
    <td width="5.88%"><?php echo '<a href="#'.$dataItem->tab_016.'" class="'.$dataItem->tab_016.'">' .$dataItem->tab_016. '</a>'; ?></td>
    <td width="5.88%"><?php echo '<a href="#'.$dataItem->tab_017.'" class="'.$dataItem->tab_017.'">' .$dataItem->tab_017. '</a>'; ?></td>
  </tr>
</table>

// Блок № 2 подсвечивание ссылки

<div class="op_01">
<a id="<?php echo $product->product_sku; ?>" class="op_02"
title="<?php echo $product->product_name; ?>">
&nbsp;<?php echo $product->product_sku; ?>&nbsp;
<?php echo shopFunctionsF::
limitStringByWord($product->product_name,'17','...'); ?></a>
</div>
<?php 
$block_hover = $product->product_sku;
?>

#<?php echo $block_hover; ?>:hover{
    color: #fff;
    text-decoration: none;
    background: #0033FF;
    display: block;
    font-size: 13px;
    cursor: pointer;
    position: relative;
    border: 1px solid #0033FF;
}
a.<?php echo $block_hover; ?>:hover{
    color: #fff;
    text-decoration: none;
    background: #0033FF;
    display: block;
    font-size: 13px;
    cursor: pointer;
    position: relative;
    border: 1px solid #0033FF;
}
a.<?php echo $block_hover; ?> {
    font-size: 13px;
    background: #666;
    text-align: center;
    color: #fff;
    text-decoration: none;
    border-color: #000;
    border-radius: 2px;
    position: relative;
    display: block;
}
.active_hover{
    background: #0033FF;
}

// Плавная прокрутка до якоря

jQuery(document).ready(function() {
   jQuery('a[href^="#<?php echo $block_hover; ?>"]').click(function(){
      var target = jQuery(this).attr('href');
      jQuery('html, body').animate({scrollTop: jQuery(target).offset().top - 120}, 800);
      return false;
   });
});