javascript - css transitions affecting previously modified css properties -


i have script applies css styles element, adds transition style element, , applies css style element. i'm trying have element styles applied instantly, , animate next change. code basic, set styles, set transition styles, set final styles. i'm experiencing first property being changed (the 1 without transition) having transition applied it, though not set transition property until afterwards. have double checked element not have transition property applied it. why this?

also, if leave 50 millisecond delay between applying first styles , transition, works expected.

you have force relayout after first styles applied (so processed without transitions) , can apply styles lead transition. way doing now, opeartions being collapsed 1 operation , undergoing transitions.

the simplest way relayout apply first css properties, settimeout(fn, 1) apply second set of properties in timer callback. there other ways force relayout requesting properties trigger relayout. don't remember properties off top of head (would take research).

i haven't tried myself, think requesting size property on element such .offsetheight force relayout. browser realizes there pending style changes , pending style changes might affect size request relayout synchronously before returning .offsetheight value, solving issue.

a similar question , answer: "force reflow" in css transitions in bootstrap


Comments

Post a Comment

Popular posts from this blog

java.util.scanner - How to read and add only numbers to array from a text file -

i'm learning java , have question regarding reading file want read numbers file contains strings well. here example of file: 66.56 "3 java 3-43 5-42 2.1 1 and here coding: public class test { public static void main (string [] args){ if (0 < args.length) { file x = new file(args[0]); try{ scanner in = new scanner( new fileinputstream(x)); arraylist<double> test = new arraylist<>(); while(in.hasnext()){ if(in.hasnextdouble()){ double f=in.nextdouble(); test.add(f);} else {in.next();} } catch(ioexception e) { system.err.println("exception during reading: " + e); } } my problem add 66.56,2.1 , 1 doesn't add 3 after "3 or ignores 3-43 , 5-42 can tell me how skip strings , add doubles here? thanks all said 3 ie; "3, 3-43 , 4-42 strings either u read string , split , check number @ " , - or put in space between characters , integers. jvm after compilation tre...
Read more

rewrite - Trouble with Wordpress multiple custom querystrings -

i'm working on adding multiple querystring , doesn't seem work. i've found codes seems work others might i'm missing something. i want like: http://mydomain.com/board/?getyear=2013&getsometext2=sometext to http://mydomain.com/board/2013/sometext/ i added code below functions.php file. doesn't seem work should though. this works. echoing querystring gets both variable without problem. http://mydomain.com/board/2013/sometext/ but doesn't. tested querystring vis isset() seems nothing being set/get http://mydomain.com/board/2013/ function add_query_vars($vars) { $vars[] = "getyear"; $vars[] = "getsometext2"; return $vars; } add_filter('query_vars', 'add_query_vars'); function add_rewrite_rules($arules) { $anewrules = array('board/([^/]+)/([^/]+)/?$' => 'index.php?pagename=board&getyear=$matches[1]&getsometext2=$matches[2]'); $arules = $a...
Read more