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

<div class="left_img">
<a href="#Z1">Z1</a>
<a href="#Z11">Z11</a>
<a href="#Z111">Z111</a>
</div>

<div class="right_scrol">
<a id="Z1">Z1</a>
<a id="Z11">Z11</a>
<a id="Z111">Z111</a>
</div>

#Z1:hover, #Z11:hover, #Z111:hover{
    color: #fff;
    background: #0033FF;
}
a.Z1:hover, a.Z11:hover, a.Z111:hover{
    color: #fff;
    background: #0033FF;
}
#Z1 .script_css, #Z11 .script_css, #Z111 .script_css{
    color: #fff;
    background: #0033FF;
} 
a.Z1 .script_css, a.Z11 .script_css, a.Z111 .script_css{
    color: #fff;
    background: #0033FF;
}

jQuery(document).ready(function() {
    jQuery('a[href^="#Z1,#Z11,#Z111"]').click(function() {
        var target = jQuery(this).attr("href");
        jQuery('div.right_scrol').animate({
            scrollTop: jQuery(target).position().top - 500}, 1000);
        return false
    }).mouseenter(function() {
        var target = jQuery(this).attr("href");
        jQuery('#Z1,#Z11,#Z111').addClass("script_css")
    }).mouseleave(function() {
        var target = jQuery(this).attr("href");
        jQuery('#Z1,#Z11,#Z111').removeClass("script_css")
    })
});

jQuery(document).ready(function() {
    jQuery('a[id^="Z1, Z11, Z111"]').click(function() {
        var target = jQuery(this).attr("id");
        return false
    }).mouseenter(function() {
        var target = jQuery(this).attr("href");
        jQuery('a.Z1, a.Z11, a.Z111').addClass("script_css")
    }).mouseleave(function() {
        var target = jQuery(this).attr("href");
        jQuery('a.Z1, a.Z11, a.Z111').removeClass("script_css")
    })
});

вот!, не знаю как в JS объединить значения Z1,Z11,Z111 "jQuery('a[href^="#Z1,#Z11,#Z111"]')" возможно сделал ошибки, но мне в принципе это не нужно так как у меня там php.