ansaurus

Question

jquery fadeIn() from opacity: 0.1 - possible?

Answer 1

+2 A:

You can set the opacity using css then begin the fadeIn

E.g.

yourElement.css('opacity', .1).fadeIn();

Matt 2010-07-01 19:53:22

Answer 2

A:

time = 1000; // time in ms to fade from 0.1 to 1
$("#id").fadeTo(0, 0.1).fadeTo(time, 1)

Adam 2010-07-01 19:55:58

FYI.. `fadeTo` with duration of 0 is the same as calling `css('opacity', ...)` directly. See [documentation](http://api.jquery.com/fadeTo)

Matt 2010-07-01 19:58:22

Ah. good point :) Upvoted your answer.

Adam 2010-07-01 20:12:28

Answer 3

+1 A:

You can do this using .animate():

.animate({ opacity: 1 });

There no need to check $.support.opacity, it'll use the alpha filter version if needed, jQuery normalizes this internally. To be clear, this supports all browsers, including IE. You can test it here.

Edit: re-reading your question it seems these styles may be in the stylesheet, not set by .css(), in which case just add a zoom: 1 for IE to fade correctly, you can view a demo of that here. You can see how the guts of it work here.

Nick Craver 2010-07-01 20:00:02

bloody ie, with the zoom:1 fix i've got it fading brilliant, but when it comes to rest on alpha 100 it suddenly looks awful! Must be something to do with IE's alpha and the transparent png image im using. oh well, i think this can be an embellishment ie users can go without (for now)! thanks for your help

Haroldo 2010-07-04 16:15:55

ansaurus

tags:

views:

answers:

jquery fadeIn() from opacity: 0.1 - possible?

related questions