">mixi Developer Center (mDC)

mixi Apps

mixi Apps (English) » Technical Specification » PC » Display Adjustment

Display Adjustment

In a mixi App, robust content should be provided to users even within a limited display field. Therefore, unnecessary blank spaces and/or content that cannot be shown in the mixi App can ruins the user experience. The page area can be automatically adjusted in the mixi App and displayed properly.


Size of a mixi App

The mixi App can be placed on multiple pages including home page and run_appli page, but thee page allocates different size of display area to the mixi App.

Page Maximum height Maximum width
home.pl (home) 228px 228px
show_friend.pl (profile) 212px 212px
run_appli.pl (canvas) over 600px(*) 760px

* The maximum height is dependent on a browser.

Adjusting Size

In the mixi App specification, the width is fixed and the height of each mixi App is variable. According to the content, the height of the display area for the mixi App can be optimized automatically.

The developer is able to use the gadgets.window.adjustHeight() by enabling the dynamic-height function in OpenSocial.

    <Require feature="dynamic-height" />

First of all, the usage of the dynamic-height function should be written by a tag and then the adjustHeight() becomes available as shown below.

// do something

The size of the display area is changed immediately after calling the adjustHeight(). In the case of adjusting display area when the mixi App is launched, the adjustHeight() should be called after finishing general communication and DOM operations for images and/or strings.