LandscapeSimulator

LandscapeSimulator

Online Use | English | 更新日志 | 反馈错误/缺漏 | Gitee


Expand Contents


1. Features

  1. Typescript writing
  2. Support mobile vertical screen rotation to simulate horizontal screen
  3. Get the simulated landscape state and length and width

2. Quick use

1.1 npm way

npm i landscape-simulator

js import LandscapeSimulator from 'landscape-simulator';

LandscapeSimulator.init({ disablePc: false, // default is true })

It is recommended to place the above initialization code in the head for execution

1.2 cdn

When using the cdn method, the script tag can be placed in the head

html <script src="https://cdn.jsdelivr.net/npm/landscape-simulator/landscape-simulator.min.js"></script> `

You can use the property auto-simulate=false to control not to use auto-on simulation, the default is auto-on.

You can use the attribute disable-pc=false to control the simulation to be enabled on the pc side. The default is not to enable it on the pc side.

When referenced by cdn, the LandscapeSimulator object will be mounted on the window

2 APIs

2.1 init

Initialize the simulator, which will be automatically initialized when referenced by cdn

LandscapeSimulator.init({ disablePc: false, // default is true })

2.2 appendChild

Add child elements to a rotating container

LandscapeSimulator.appendChild(htmlElement);

2.3 getSimulateSize

Get the emulated later screen size

const size = LandscapeSimulator.getSimulateSize();

2.4 isSimulateLandscape

Get whether it is currently in a state of simulating a landscape screen

const bool = LandscapeSimulator.isSimulateLandscape();

2.5 onSimulateChange

Listen for changes in the state of the simulated horizontal screen

LandscapeSimulator.onSimulateChange(isSimulate => { });