...

View Full Version : onClick opacity = 100%



btaylor
01-19-2012, 10:07 PM
Ok so I have two images class1 & class2 which both have opacity:0.3; and filter:alpha(opacity=30); added with css. I am trying to get it so when I click on class1 it will either fade in (ideally) or display as 100% opacity. I do not want both class's to be able to be 100% so if one is clicked the other would be 30%.

I also have multiple instances of class1 and class2.

If anyone can help me I will praise you on the highest mountain!

Thanks,

B

btaylor
01-19-2012, 10:39 PM
I got it working, except for in IE the toggling doesn't work.. and I am pretty sure it has something to do with this line. Can anyone help me correct what is wrong with this? I am sure it's syntax or something.

$(event.target).css('filter','opacity', 100);

xelawho
01-19-2012, 10:48 PM
so for example you click on class 1 and all the class 1 images go to 100% opacity?



<input type="button" value="class 1" onclick="opac()"/>
<script type="text/javascript">
function opac() {
pics=document.getElementsByTagName("img")
for(x=0;x<pics.length;x++) {
if (pics[x].className=="class1") {
pics[x].style.opacity=1
pics[x].style.filter="alpha(opacity=100)" // IE hack
}
}
}

</script>


[EDIT] oops - didn't realise you were doing it in jQuery...

xelawho
01-19-2012, 10:54 PM
no, by clicking on the pic. even easier...



<body>
<img src="some_pic.jpg" onclick="opac(this)" class="class1"/>
<script type="text/javascript">
function opac(pic) {
pic.style.opacity=1
pic.style.filter="alpha(opacity=100)"
}

</script>
</body>



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum