您当前的位置: 
最好有个例子
------解决思路----------------------
最好楼主会结帖，，，最讨厌不结帖的人了。。。
<!DOCTYPE html>
<html>
<head>
<style>
#J_Roller div{width:100px;float:left;height:40px;line-height:40px;padding:auto;}
#myImg img{opacity:0.3;}
</style>
</head>
<body>
<p>滑过 就 触发了</p>
<div class="roller" id="J_Roller">
<div onmouseover="myFunction('mg')" onmouseout="myF2()">玫瑰</div>
<div onmouseover="myFunction('hh')" onmouseout="myF2()">荷花</div>
<div onmouseover="myFunction('pgy')" onmouseout="myF2()">蒲公英</div>
</div>
<div style="clear:both;"/>
<div id="myImg">
<img class="hh" src="http://img.store.sogou.com/net/a/07/link?appid=100520033&url=http%3A%2F%2Fwww.langya.cn%2Flyxw%2Fzhdlypk%2F201406%2FW020140618342166848567.jpg" style="width:200px;height:120px;"/>
<img class="mg" src="http://thumbnail.image.rakuten.co.jp/@0_mall/pistil/cabinet/02769696/img64253494.jpg" style="width:200px;height:120px;"/>
<img class="hh" src="http://file12.mafengwo.net/M00/92/C9/wKgBpU4jn3CJOfbAAAGnItHffiM32.groupinfo.w200.jpeg" style="width:200px;height:120px;"/>
<img class="hh" src="http://img.store.sogou.com/net/a/03/link?appid=100520033&url=http%3A%2F%2Fwww.klmhw.com%2Fuploads%2Fallimg%2F130812%2F1-130Q20UT00-L.jpg" style="width:200px;height:120px;"/>
<img class="mg" src="http://www.tghua.com/static/flower_team/2011/0605/13072415894187_index.jpg" style="width:200px;height:120px;"/>
<img class="pgy" src="http://img4.duitang.com/uploads/item/201208/22/20120822095241_83JTc.jpeg" style="width:200px;height:120px;"/>
<img class="pgy" src="http://img5q.duitang.com/uploads/item/201203/26/20120326220132_KRLCr.jpeg" style="width:200px;height:120px;"/>
<img class="mg" src="http://www.tghua.com/static/team/2014/0512/13999088903744.jpg" style="width:200px;height:120px;"/>
<img class="hh" src="http://cache1.tuanimg.com/deal/deal_image/0043/6069/normal/6ed267dc-2421-4f06-ac6c-05242b134bf6.jpg" style="width:200px;height:120px;"/>
</div>
<script type="text/javascript" src="http://www.w3school.com.cn/jquery/jquery.js"></script>
<script>
function myFunction(job)
{
var newClass="."+job
$(newClass).css("opacity","1");
}
function myF2(){
$("img").css("opacity","0.3");
}
</script>
</body>
</html>
------解决思路----------------------
说个大致的思路，你可以给右边的导航一个自定义属性并赋值，比如data-toggle,给和它绑定的图片同样的属性及属性值，点击导航的时候，先获取它的data-toggle值，然后遍历图片的这个属性，有同样值的改变图片的opacity,border什么的~