📅 最后修改于: 2020-12-08 06:30:57 🧑 作者: Mango
它允许更改在指定持续时间内出现的属性值，并通过为每个状态应用不同的样式来将元素的行为从一种状态更改为另一种状态。
下表列出了jQuery Mobile框架中使用的一些页面转换-
| Sr.No. | Transition & Description | For Pages | For Dialogs |
|---|---|---|---|
| 1 |
fade You can make elements fade in and out of visibility. |
Fade Page | Fade Dialog |
| 2 |
flip Flip the elements from back to front to the next page. |
Flip Page | Flip Dialog |
| 3 |
pop You can create a popup window. |
Pop Page | Pop Dialog |
| 4 |
flow Display the next page by keeping current page away. |
Flow Page | Flow Dialog |
| 5 |
slide You can slide the page from right to left. |
Slide Page | Slide Dialog |
| 6 |
slidefade Slides the page from right to left and fades in the next page. |
Slidefade Page | Slidefade Dialog |
| 7 |
slideup Slides the page from bottom to up. |
Slideup Page | Slideup Dialog |
| 8 |
slidedown Slides the page from top to bottom. |
Slidedown Page | Slidedown Dialog |
| 9 |
turn You can turn to the next page. |
Turn Page | Turn Dialog |
| 10 |
none You cannot use any transition effect by using this attribute. |
None Page | None Dialog |
默认情况下，页面在框架中将具有淡入淡出过渡。您可以通过将data-transition属性添加到链接来使用自定义过渡。您可以全局使用defaultPageTransition选项为页面使用不同的默认过渡效果。对于对话框，可以使用defaultDialogTransition选项。
除淡入淡出过渡外，所有过渡都支持3D变换。不支持3D变换的设备将必须使用淡入淡出过渡。某些浏览器不支持每种过渡类型的3D转换，因此您可以使用渐变作为默认过渡后备。
当您滚动到页面或滚动到页面时，过渡设置为无，滚动位置将是设备屏幕高度的三倍。有时，当您单击任何导航元素时，响应可能会变慢或浏览器可能崩溃；因此，为了避免这种情况，我们使用getMaxScrollForTransition函数将滚动位置用于过渡。
当窗口宽度大于像素宽度时，可以禁用过渡。您可以使用$ .mobile.maxTransitionWidth全局选项配置过渡的最大宽度，默认情况下将其设置为false。它采用像素宽度或假值之类的值，并且当窗口高于指定值时，如果过渡不是假值，则过渡将设置为无。
您可以使用页面容器窗口小部件的change()方法的allowSamePageTransition选项将过渡添加到当前页面。
您可以使用$ .mobile.transitionHandlers选项在页面中创建自定义转换，该选项可扩展网站或应用程序上转换的选择。