domReady vs ready - Migrating to Polymer 1.0 -
in polymer0.5, had following code:
template:
<div class="scroll"> <div class="content"> <content></content> </div> </div> script:
domready: function() { var width = $(this.shadowroot).find('.content')[0].scrollwidth; } this code worked, , received non-zero value width.
now trying migrate polymer1.0, added id div:
<div class="scroll"> <div id="content" class="content"> <content></content> </div> </div> and script now:
ready: function() { var width = this.$.content.scrollwidth; } however, width 0.
is there difference between old domready function, , new ready function? have tried using attached function did not work either.
when try access width later on (triggered button press), non-zero value looking for.
the element used this:
<my-scrollbar> lorem ipsum dolor sit amet, consectetur adipiscing elit. nam purus leo, sagittis lobortis velit vel, viverra vulputate purus. proin lacinia magna eu erat iaculis, eget mollis lectus mattis. </my-scrollbar> so inner text determines dimensions of element.
it turns out original code working in safari, not in chrome.
with zikes suggestion, added in async, , works in both browsers.
final answer:
attached: function() { this.async(function(){ var width = this.$.content.scrollwidth; },1) }
Comments
Post a Comment