jquery - -webkit-box-shadow not changing properly with javascript -


i have following code:

var oneheight = math.ceil(0.012*window.innerheight).tostring()+"px"; var usboxshadow="0px "+oneheight+" 0px rgba(0,140,255,1), 0px "+oneheight+" 25px rgba(0,0,0,.7)"; console.log(usboxshadow); $(".unselected").css("-webkit-box-shadow",usboxshadow); 

when output usboxshadow console, should:

0px 20px 0px rgba(0,140,255,1), 0px 20px 25px rgba(0,0,0,.7)  

(the -webkit-box-shadow property)
however, when retrieve property jquery.css(),

console.log($(".unselected").css("-webkit-box-shadow")); 

i different result:

rgb(0, 140, 255) 0px 20px 0px 0px, rgba(0, 0, 0, 0.701961) 0px 20px 25px 0px  

first, did 0px come in each of arguments?

second, why rgba alpha(opacity) 0.701961, when should 0.7?

please tell me have done wrong.

edit:

after running code, box-shadow of elements class unselected doesn't display.

[updated second question, see @ bottom.]

1) in css, can specify box-shadow using two, 3 or pixel values. first 2 x,y offsets, 2 others spread value & radius. see mdn more infos.

when set css rule (with css or jquery), browser automatically put full values (in case, 4 px values). that's why 1 when targetting jquery: last 1 given browser default behaviour (see computed panel in chrome inspector: shows values didn't have set because default ones).

2) .7 or .701961 isn't different. think code seems good, sometimes, conversion issues can exists in float numbers (= decimals). way computer stores decimal number may vary following various complex criterias, think. see this subject on stackoverflow.

i think should'nt worry that. there's maybe way force proper conversion in js or jquery. can't tell more.

hope help. :)

update

here experimentations on js fiddle (updated version comment on answer). problem comes var oneheight = math.ceil(0.012*window.innerheight).tostring()+"px";

i didn't paid attention (sorry), window.innerheight returns height of window. therefore, y offset of shadow vary depending on browser window size. that's why obtain different shadow.

once again, have no other explanations decimal issue. ^^


Comments