2952 posts
  • Has been part of the Envato Community for over 5 years
  • Has referred 200+ members
  • Has sold $125,000+ on Envato Market
  • Had an item featured in an Envato Bundle
+10 more
DDStudios says

Does anyone know a good tutorials about Opacity stuff. You know like we see a lot on portfolio when there is a lot of image and then when you hover it become darker or lighter or more saturated ..

Thanks !

707 posts
  • Has referred 10+ members
  • Has sold $10,000+ on Envato Market
  • Has been a beta tester for an Envato feature
  • Has collected 10+ items on Envato Market
+2 more
ChillThemes says
18 posts
  • Has been part of the Envato Community for over 4 years
  • Has sold $1,000+ on Envato Market
  • Has collected 10+ items on Envato Market
  • Sells items exclusively on Envato Market
chillyorange says

Why not just use jQuery to manipulate the opacity of an object? There is no need to worry about the different implementation of opacity between browsers (meaning between IE and real browsers).

You can just use the jQuery css() function to manipulate the opacity or the animate() function to animate the manipulation.

Can’t think of any tutorial right away…

2952 posts
  • Has been part of the Envato Community for over 5 years
  • Has referred 200+ members
  • Has sold $125,000+ on Envato Market
  • Had an item featured in an Envato Bundle
+10 more
DDStudios says
Something like this? http://hv-designs.co.uk/2009/01/19/jquery-fade-infade-out/

Yeah that look good .. Any other suggestion anyone ?

2952 posts
  • Has been part of the Envato Community for over 5 years
  • Has referred 200+ members
  • Has sold $125,000+ on Envato Market
  • Had an item featured in an Envato Bundle
+10 more
DDStudios says
Why not just use jQuery to manipulate the opacity of an object? There is no need to worry about the different implementation of opacity between browsers (meaning between IE and real browsers).

You can just use the jQuery css() function to manipulate the opacity or the animate() function to animate the manipulation.

Can’t think of any tutorial right away…

I don’t have any Jquery knowledge right now , I shouuld learn it someday.

18 posts
  • Has been part of the Envato Community for over 4 years
  • Has sold $1,000+ on Envato Market
  • Has collected 10+ items on Envato Market
  • Sells items exclusively on Envato Market
chillyorange says
Why not just use jQuery to manipulate the opacity of an object? There is no need to worry about the different implementation of opacity between browsers (meaning between IE and real browsers).

You can just use the jQuery css() function to manipulate the opacity or the animate() function to animate the manipulation.

Can’t think of any tutorial right away…
I don’t have any Jquery knowledge right now , I shouuld learn it someday.

Sorry, my bad! I thought with all the nice themes you released, you knew some jQuery stuff already… Anyway, it’s definitely worth getting into!

2952 posts
  • Has been part of the Envato Community for over 5 years
  • Has referred 200+ members
  • Has sold $125,000+ on Envato Market
  • Had an item featured in an Envato Bundle
+10 more
DDStudios says
Why not just use jQuery to manipulate the opacity of an object? There is no need to worry about the different implementation of opacity between browsers (meaning between IE and real browsers).

You can just use the jQuery css() function to manipulate the opacity or the animate() function to animate the manipulation.

Can’t think of any tutorial right away…
I don’t have any Jquery knowledge right now , I shouuld learn it someday.
Sorry, my bad! I thought with all the nice themes you released, you knew some jQuery stuff already… Anyway, it’s definitely worth getting into!

lol thanks for the compliment but no , I don’t :)

Actually I learned HTML /CSS some month ago only .. all that computer stuff is new for me , even design lol !

426 posts
  • Has been part of the Envato Community for over 5 years
  • Has referred 10+ members
  • Has sold $5,000+ on Envato Market
  • Has been a beta tester for an Envato feature
+3 more
vasilios says

LEARN JQUERY DD . NOW.

But, yes, with images, you just create a 1×1 pixel GIF /PNG image that is filled with a certain opacity of a certain color, and then set that as the background image and repeat it. For a rollover effect, create another image with another opacity and/or color.

If opacity is to be used on my personal site, I just use rgba. :)

2952 posts
  • Has been part of the Envato Community for over 5 years
  • Has referred 200+ members
  • Has sold $125,000+ on Envato Market
  • Had an item featured in an Envato Bundle
+10 more
DDStudios says
LEARN JQUERY DD . NOW.

But, yes, with images, you just create a 1×1 pixel GIF /PNG image that is filled with a certain opacity of a certain color, and then set that as the background image and repeat it. For a rollover effect, create another image with another opacity and/or color.

If opacity is to be used on my personal site, I just use rgba. :)

Oh ok , so I could use any pattern .. pretty interesting.

630 posts
  • Has been part of the Envato Community for over 5 years
  • Has sold $100+ on Envato Market
  • Has collected 100+ items on Envato Market
  • Sells items exclusively on Envato Market
+2 more
RobbyDesigns says

Let’s let bygones be bygones mate: Download this small template, look at the code, it will all be clear. http://www.robbydesigns.com/previews/opacity.zip

(Needs a hack or something for Firefox but good in IE)

by
by
by
by
by
by