custom font

Dom#

Overview#

The dom module is used to manipulate the components in weex pages.

You can use these APIs to get a component’s bounding rect in the page, or scroll a list to some specific component, or add a font-face rule to the page and so on.

Note: The addRule method is currently used only with font-face supportability.

API#

scrollToElement(ref, options)#

Scroll the scrollable component to the referenced component. This API should only be used in the children components of a scrollable component, such as in a <scroller> or <list> component.

NOTE: You can use weex.requireModule('dom') to requrie the dom module, and use weex.requireModule('dom').scrollToElement to call this API.

Arguments#

  • ref(Node): the referenced component who is meant to scroll into the view.
  • options(object):
    • offset(number): An space on top of the ref component, which is also scrolling down to the visual viewport. Default is 0.
    • animated (bool): 0.10+ Indicates whether a scroll animation should be played. If set to false, the ref component will jump into the view without any transition animation. Default is true.

Example#

Scroll To Floor

getComponentRect(ref, callback) v0.9.4+#

support: >=0.9.4

You can get the bounding rect of the referenced component using this API.

An example callback result should be like:

{
result: true,
size: {
bottom: 60,
height: 15,
left: 0,
right: 353,
top: 45,
width: 353
}
}

If you want to get the bounding rect of outside viewport of the weex container, you can specify the ref as a literal string 'viewport', like getComponentRect('viewport', callback).

Example#

get box’s rect

addRule(type, contentObject) v0.12.0+#

support: >=0.12.0

Reference custom Font for more detail.

Edit this page on GitHub