`
cxy020
  • 浏览: 61141 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

屏幕旋转的事件和样式

阅读更多

事件

window.orientation,取值:正负90表示横屏模式、0和180表现为屏模式;

复制代码
window.onorientationchange = function(){
    switch(window.orientation){
        case -90:
        case 90:
        alert("横屏:" + window.orientation);
        case 0:
        case 180:
        alert("竖屏:" + window.orientation);
        break;
    }
}  
复制代码

样式

复制代码
//竖屏时使用的样式
@media all and (orientation:portrait) {
.css{}
}

//横屏时使用的样式
@media all and (orientation:landscape) {
.css{}
}
复制代码
分享到:
评论

相关推荐

    swift-默认样式系统样式的ActionSheet可以自定义;支持屏幕旋转

    默认样式、系统样式的ActionSheet,可以自定义;支持屏幕旋转

    QT安卓屏幕动态旋转

    点击按钮可以动态旋转屏幕,不是在XML里更改样式锁死的。

    Android屏幕旋转之横屏竖屏切换的实现

    开门见山的说,实现屏幕自动/手动旋转的方式有两种: 一种是在工程的代码中定义,这种方式在横竖屏切换时执行的操作是:销毁当前Activity–根据新的屏幕尺寸重建Activity。如果不进行数据存储的操作,在切换的过程中...

    javascript实现根据iphone屏幕方向调用不同样式表的方法

    当iphone屏幕旋转式,这段JS代码可以动态调用不同的样式来适应屏幕变换 [removed] function orient() { switch(window.orientation){ case 0: document.getElementById(orient_css).href = css/iphone_portrait....

    uniapp中设置横屏竖屏

    uniapp中设置横屏竖屏,或者如何进行横竖屏切换

    jQuery响应式宽屏图片3D旋转切换特效.zip

    如:Javascript、VBScript、Document Object Model(DOM,文档对象模型)、Layers和 Cascading Style Sheets(CSS,层叠样式表),这里主要讲Javascript。那么Javascript是什么东西?Javascript就是适应动态网页制作...

    jQuery响应式水平滚动旋转木马插件

    Carousel.js是一款非常实用的jQuery响应式水平滚动旋转木马插件。它使用简单,样式可以完全自定义,并且会随屏幕的大小自适应容器的宽度和高度。

    spin-controls:用于Three.js Object3D和Camera的轨迹球样式控件。 具有指示轨迹球准确性和无限旋转的指针

    THREE.OrbitControls和其他“转盘”样式控件会限制围绕上轴(通常为+ Y)的旋转。 约束是好的。 但是,当模型没有自然向上的方向,或者您必须从“滚动”方向查看场景时,请使用轨迹球样式控件。 与其他轨迹球实现...

    蚂蚁兵屏幕捕快 2.0.1.zip

    蚂蚁兵屏幕捕快(原屏幕捕快)是一款简洁易用的屏幕捕捉软件,能够让您得心应手地捕获到需要的屏幕截图。提供多种捕捉方式,主要可以捕捉整个屏幕、选定区域、界面对象(如菜单等)、活动程序窗口、当前窗口等;图像...

    ActionScript开发人员指南中文版

    响应错误事件和状态 比较错误类 处理错误示例:CustomErrors应用程序 第章:使用正则表达式 正则表达式基础知识 正则表达式语法 对字符串使用正则表达式的方法 正则表达式示例:Wiki解析程序 第章:使用XML XML基础...

    Android应用开发入门教程

    6.4 屏幕间的跳转和事件的传递62 6.4.1.跳转的方法62 6.4.2.带有返回值的跳转63 6.5菜单的使用66 6.6弹出对话框67 6.6.1. 提示信息和两个按钮的对话框68 6.6.2. 提示信息和三个按钮的对话框69 6.6.3. 列表项对话框...

    Foundation Actionscript 3.0 Animation

    2.5.4事件和事件处理器 2.5.5侦听器和处理器 2.5.6动画事件 2.6显示列表 2.7用户交互 2.7.1鼠标事件 2.7.2鼠标位置 2.7.3键盘事件 2.7.4键盘代码 2.8小结 第3章动画中的三角学 3.1什么是三角学 3.2角 3.2.1弧度和度 ...

    LEEAlert:优雅的可自定义Alert ActionSheet

    支持屏幕旋转适应同时可自定义横竖屏最大宽度和高度 支持自定义动作添加可动态调整其样式 支持内部添加的功能项的间距范围设置等 支持圆角设置支持阴影效果设置 支持级别和优先级多个同时显示时根据优先级的顺序依次...

    c语言Turbo C下写的俄罗斯方块.zip

    - 定义方块的样式和旋转规则,以及控制方块的下落、移动和旋转。 - 实现消除行的逻辑,以及分数的计算和更新。 - 检测游戏是否结束以及游戏结束后的处理。 代码还包括一些图形绘制和交互逻辑,如绘制方块、清空方块...

    react-native-video实现视频全屏播放的方法

    本篇文章主要介绍下怎么使用react-native-video播放视频,以及如何实现全屏播放,屏幕旋转时视频播放器大小随之调整,显示全屏或收起全屏。 首先来看看react-native-video有哪些功能。 基本功能 控制播放速率 控制...

    [Flash.ActionScript.3.0动画教程

    2.5.4 事件和事件处理 2.5.5 事件侦听器与处理函数 2.5.6 动画事件 2.6 显示列表 2.7 用户交互 2.7.1 鼠标事件 2.7.2 鼠标位置 2.7.3 键盘事件 2.7.4 键码 2.8 小结 第3章 三角学应用 3.1 什么是三角学(Trigonometry...

Global site tag (gtag.js) - Google Analytics