HTML5: Customize Window Settings Dialog Box

When you want to view an HTML5 application in the Embedded WebKit browser you can use this dialog box to customize the list of screen sizes that you can select in the Web Browser toolbar. The dialog box displays a table that lists the screen sizes that are used on various types of desktop and mobile devices.

You open this dialog box by clicking the Other Options icon () in the toolbar of the Web Browser window and choosing Customize in the dropdown list.

The icons for screen sizes in the toolbar of the Web Browser window are displayed in the order that they appear in the table. Select the checkbox in the Toolbar column in the table for each screen size that you want to appear in the toolbar. You can use the following buttons to the right of the table to manage the order of the screen sizes and to create and delete screen sizes.

New. Click New to create a custom screen size. When you click New a new row appears in the table. Type the new name and values directly in the text fields in the table.
Remove. Select a row in the table and click Remove to remove the screen size.
Move Up and Move Down. Select a row in the table and use the Move Up and Move Down buttons to change the order of the icons in the Web Browser window toolbar.

You can modify the properties of a screen size by editing the text fields in the table. To edit a property, double-click in the text field of the property that you want to edit, type the new value and press the Return key on your keyboard. You can change the icon that is used to represent the screen size by clicking the icon in the Type column and choosing an icon from the dropdown menu.

See Also: Running an HTML5 Application; Inspecting HTML5 Code with the Browser; About HTML5 Applications

Legal Notices