# Javascript assistance required

**URL:** <https://forum.kirupa.com/t/javascript-assistance-required/267321>\
**Category:** web dev\
**Created:** [July 30, 2008, 5:59pm UTC](https://forum.kirupa.com/t/javascript-assistance-required/267321 "2008-07-30T17:59:52Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![m00nz00mer](https://avatars.discourse-cdn.com/v4/letter/m/4af34b/32.png) [@m00nz00mer](https://forum.kirupa.com/u/m00nz00mer)\
**Post date:** [July 30, 2008, 5:59pm UTC](https://forum.kirupa.com/t/javascript-assistance-required/267321/1 "2008-07-30T17:59:52Z")

</div>

Hey, Ive never used Javascript before (well only for really basic things). Im wanting to create a rollover effect on my site that puts a slightly transparent colour layer over the top of an image.

I have this code here but im not sure how i can implement it or how it works?

// set image over states   
$(".classname img").mouseover(function(){  
$(this).fadeTo(‘fast’,0.8).parents(’.classname, li’).css(“background”,"#fe0002");  
}).mouseout(function(){  
$(this).fadeTo(‘fast’,1).parents(’. classname, li’).css(“background”,“none”);  
});

the image i want to apply the effect to is…

\<li class=“workCollection”\>\<a href="#workSet1"\>\<img src=“images/work1.jpg” /\>\</a\>\</li\>

can anyone help me?

or…

could i use? somthing like…

$$(‘div#mb1 img’).each(function(e){  
var fade = new Fx.Style(e, ‘opacity’, {wait:false});  
fade.set(.5);  
e.addEvent(‘mouseover’, function(){  
fade.start(1);  
});  
e.addEvent(‘mouseout’, function(){  
fade.start(.5);  
});  
});

but im not sure how to use it?