onOrientationChange - 方向変更スクリプト

このブラウザが実行中のデバイスが縦長 (垂直) から横長 (水平) または横長から縦長に回転された後に JavaScript コードをアクティブにします。

カテゴリ

イベント

構文

<xp:eventHandler event="onOrientationChange" attributes>content</xp:eventHandler>

使用法

設計モードで、[すべてのプロパティ] をクリックし、[events] カテゴリの [onOrientationChange] を探します。

シングルページアプリケーションコントロールで使用できます。

注: このイベントはリリース 9.0.1 で新しく追加されました。

このイベントは、モバイルデバイスを回転したときに Web アプリケーションのコンテンツの外観を動的に変更するために使用できます。すべてのモバイルデバイスがこのイベントをサポートするわけではありません。

すべてのモバイルブラウザを完全にサポートするためには、onResize イベントに対しても応答し、ウィンドウの幅と高さの比率に基づいて方向を計算することが必要となる可能性があります。

例

<xe:singlePageApp>
		<xp:eventHandler event="onOrientationChange" submit="false">
			<xe:this.script><![CDATA[
console.log("onOrientationChange "
    +"innerWidth:"+window.innerWidth+" innerHeight:"+window.innerHeight);
]]&gt;</xe:this.script>
		</xp:eventHandler>
</xe:singlePageApp>