控制面板怎么回复到不是经典模式？_百度知道
控制面板怎么回复到不是经典模式？
不知道怎么样被我设置了一下，控制面板变成经典模式了，问下怎么恢复原来的模式啊？
我有更好的答案
打开“控制面板”就是的点击就会还原经典视图
右键我的电脑，属性，设置，然后调整为最佳外观就可以了
你进控制面板左边就有这个点一下就好了
开始菜单-----右键属性。
其他类似问题
为您推荐：
控制面板的相关知识
等待您来回答
下载知道APP
随时随地咨询
出门在外也不愁我们开门见山，一起来学习如何进行H5 滑动页面的开发。
一、容器整体滑动（DEMO只演示A-B-C-B，下同）
模拟动画效果见下图(上)，滑动分解见下图(下)：
DEMO地址：
具体实现重点代码解析：
布局方式：父容器相对定位并撑满整个device的viewport，子页面绝对定位并依次并排排列在viewport中（从左到右）
.view-container { // 父容器布局方式
position: relative;
width: 100%;
height: 100%;
padding-top: 44px;
box-sizing: border-box;
-webkit-transform: translate3d(0,0,0); //激活GPU 3D加速
-webkit-backface-visibility: hidden;
.page-container { // 子页面布局方式
position: absolute;
z-index: 1;
left: 0; // 初始化为0，动态计算第N个page，并赋值(N-1)*100%
width: 100%;
height: 100%;
overflow: hidden;
background-color: #F8F8F8;
滑动方式：父容器利用CSS3的动画transform3D进行X轴的滑动(JS控制直接喷到DOM节点中)
-webkit-transform: translate3d(-100%, 0px, 0px); -webkit-transition: 300ms; transition: 300ms;
二、单个页面滑动
模拟动画效果，见下图：
DEMO地址：
具体实现重点代码解析：
布局方式：父容器高度100%，子容器正常文档流布局（X轴隐藏，Y轴默认原生滚动）
.view-container {
height: 100%;
.page-container {
position: relative;
width: 100%;
min-height: 100%;
overflow-x: hidden;
background-color: #F8F8F8;
滑动方式：利用class添加动画样式（keyframes animation），左右进出各一种
@-webkit-keyframes sliderightout{from{-webkit-transform:translateX(0px);opacity:1}to{-webkit-transform:translateX(50%);opacity:0}}
@-webkit-keyframes slideleftin{from{-webkit-transform:translateX(-50%);opacity:0}to{-webkit-transform:translateX(0px);opacity:1}}
@-webkit-keyframes slideleftout{from{-webkit-transform:translateX(0px);opacity:1}to{-webkit-transform:translateX(-50%);opacity:0}}
@-webkit-keyframes sliderightin{from{-webkit-transform:translateX(50%);opacity:0}to{-webkit-transform:translateX(0px);opacity:1}}
.slideleftout{-webkit-animation:slideleftout 350ms ease-in-out;}
.slideleftin{-webkit-animation:slideleftin 350ms ease-in-out;}
.sliderightout{-webkit-animation:sliderightout 350ms ease-in-out;}
.sliderightin{-webkit-animation:sliderightin 350ms ease-in-out;}
.animatestart{position:absolute;top:0;left:0;z-index:3;width:100%;height:100%;overflow-x:hidden}
.animatestart.page-container{overflow-x:hidden;-webkit-transform:translate3d(0,0,0);-webkit-backface-visibility:hidden;background-color:#f5f5f5}
三、双页联动滑动
模拟动画效果，见下图：
DEMO地址：
具体实现重点代码解析：
布局方式：类似于第一种，父容器和子容器都绝对定位于viewport中，不同点是父类的上级布局更加细分，且大胆使用了webkit-box弹性盒子；子容器没有并排显示，而是重叠隐藏
.view-container {
position: absolute;
width: 100%;
height: 100%;
.page-container {
position: absolute;
z-index: 1;
bottom: 0;
width: 100%;
height: 100%;
overflow: hidden;
background-color: #F8F8F8;
-webkit-transform:translate3d(0,0,0);
-webkit-backface-visibility:hidden;
滑动方式：滑动开始时先将隐藏的下一个子页面拉到viewport右侧与当前子页面平行，然后紧接着两个子页面同步滑动，最后回归样式，中间的时间差事件均有JS控制（详见demo逻辑）
四、三舞台双页视差滑动
模拟动画效果见下图（上），分解逻辑图见下图（下）：
DEMO地址：
布局方式：这里我设定了三舞台(stage)的概念，其实就是当前viewport的左右侧各虚拟一个同样大小的viewport，当然，正常情况下我们只能看到当前舞台的子页面，leftstage是-100%的位置，rightstage是100%的位置，我们分别用三个class来定义：pageOld、pageInit、pageNew来代替
.pageInt {
-webkit-transform: translateX(0);
transform: translateX(0);
.pageOld {
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
.pageNew {
-webkit-transform: translateX(100%);
transform: translateX(100%);
滑动方式：
1，定义正向（向左滑）和反向（向右滑）两个概念,；
2，定义快速和慢速两个概念；
则就是四种动态两种组合：正向快速+正向慢速、反向快速+反向慢速；
.slideSlow {
-webkit-transition: -webkit-transform 400ms cubic-bezier(0.42, 0, 0.58, 1.0) 0.1s;
-ms-transition: transform 400ms cubic-bezier(0.42, 0, 0.58, 1.0) 0.1s;
.slideFast {
-webkit-transition: -webkit-transform 300ms cubic-bezier(0.42, 0, 0.58, 1.0);
-ms-transition: transform 300ms cubic-bezier(0.42, 0, 0.58, 1.0);
.slideSlowBack {
-webkit-transition: -webkit-transform 400ms cubic-bezier(0.42, 0, 0.58, 1.0);
-ms-transition: transform 400ms cubic-bezier(0.42, 0, 0.58, 1.0);
.slideFastBack {
-webkit-transition: -webkit-transform 300ms cubic-bezier(0.42, 0, 0.58, 1.0) 0.1s;
-ms-transition: transform 300ms cubic-bezier(0.42, 0, 0.58, 1.0) 0.1s;
其中在三舞台视差滑动中的滑动曲线是经过数次的真机实验后找到的参数（cubic-bezier(0.42, 0, 0.58, 1.0)），这条曲线的滑动形态最接近IOS APP页面的滑动，希望对大家有用。
原文来源于携程UED部门的飞柳
原文地址：/blog/?p=3697
本文标题：
本文地址：/html5css3/8919.html
除非注明，本站文章均为原创或编译，转载请注明出处和原文链接，转载同时请务必保留原网站网址。
为你推荐的相关文章
优秀的移动互联网博文
Copyright@
All Rights Reserved ICP备案号：桂ICP备号-2本站声明所有资源均是网上搜集或网友上传提供，如有侵犯您的版权，请及时联系我们（），我们将尽快处理。掌阅书城里，把阅读方式改成了横屏往上滑的模式，可是想改回来，长按却没有用了，怎么再改回来啊？_百度知道
掌阅书城里，把阅读方式改成了横屏往上滑的模式，可是想改回来，长按却没有用了，怎么再改回来啊？
怎么再改回来啊，把阅读方式改成了横屏往上滑的模式，可是想改回来，长按却没有用了掌阅书城里
我有更好的答案
阅读方式设置那里有
其他类似问题
为您推荐：
等待您来回答
下载知道APP
随时随地咨询
出门在外也不愁基于CSS3的Web App横向滑动模式演化
招聘信息：
前言随着移动网络速率和设备硬件水平的不断提升，Web App的发展更加的native化，其表现效果和性能也会越来越好，在可预计的未来很有可能替代native或者平起平坐，那么我们研究更好的交互体验是非常有必要的。目前我们所常见的Web App越来越多的是以SPA(single page application)的模式进行开发，同时嵌套在Android或者iOS本地壳里面，也就是hybrid应用，这种开发方式所带来的优势就不多讨论，本文研究的重点是在SPA模式中，页面间横向滑动切换场景时模式是怎样设计的。在这篇文章里，笔者将展示并阐述四种横向滑动模式的架构布局及CSS设计方案，供大家参考(多图请耐心加载)。一、容器整体滑动（DEMO只演示A-B-C-B，下同）模拟动画效果见下图(上)，滑动分解见下图(下)：DEMO地址：布局方式：父容器相对定位并撑满整个device的viewport，子页面绝对定位并依次并排排列在viewport中（从左到右）.view-container&{&//&父容器布局方式
&&position:&
&&width:&100%;
&&height:&100%;
&&padding-top:&44
&&box-sizing:&border-
&&-webkit-transform:&translate3d(0,0,0);&//激活GPU&3D加速
&&-webkit-backface-visibility:&
.page-container&{&//&子页面布局方式
&&position:&
&&z-index:&1;
&&left:&0;&//&初始化为0，动态计算第N个page，并赋值(N-1)*100%
&&width:&100%;
&&height:&100%;
&&overflow:&
&&background-color:&#F8F8F8;
}滑动方式：父容器利用CSS3的动画transform3D进行X轴的滑动(JS控制直接喷到DOM节点中)-webkit-transform:&translate3d(-100%,&0px,&0px);&-webkit-transition:&300&transition:&300二、单个页面滑动模拟动画效果，见下图：DEMO地址：布局方式：父容器高度100%，子容器正常文档流布局（X轴隐藏，Y轴默认原生滚动）.view-container&{
&&height:&100%;
.page-container&{
&&position:&
&&width:&100%;
&&min-height:&100%;
&&overflow-x:&
&&background-color:&#F8F8F8;
}滑动方式：利用class添加动画样式（keyframes animation），左右进出各一种@-webkit-keyframes&sliderightout{from{-webkit-transform:translateX(0px);opacity:1}to{-webkit-transform:translateX(50%);opacity:0}}
@-webkit-keyframes&slideleftin{from{-webkit-transform:translateX(-50%);opacity:0}to{-webkit-transform:translateX(0px);opacity:1}}
@-webkit-keyframes&slideleftout{from{-webkit-transform:translateX(0px);opacity:1}to{-webkit-transform:translateX(-50%);opacity:0}}
@-webkit-keyframes&sliderightin{from{-webkit-transform:translateX(50%);opacity:0}to{-webkit-transform:translateX(0px);opacity:1}}
.slideleftout{-webkit-animation:slideleftout&350ms&ease-in-}
.slideleftin{-webkit-animation:slideleftin&350ms&ease-in-}
.sliderightout{-webkit-animation:sliderightout&350ms&ease-in-}
.sliderightin{-webkit-animation:sliderightin&350ms&ease-in-}
.animatestart{position:top:0;left:0;z-index:3;width:100%;height:100%;overflow-x:hidden}
.animatestart.page-container{overflow-x:-webkit-transform:translate3d(0,0,0);-webkit-backface-visibility:background-color:#f5f5f5}三、双页联动滑动模拟动画效果，见下图：DEMO地址：布局方式：类似于第一种，父容器和子容器都绝对定位于viewport中，不同点是父类的上级布局更加细分，且大胆使用了webkit-box弹性盒子；子容器没有并排显示，而是重叠隐藏.view-container&{
&&position:&
&&width:&100%;
&&height:&100%;
&&left:&0;
.page-container&{
&&position:&
&&z-index:&1;
&&left:&0;
&&bottom:&0;
&&right:&0;
&&width:&100%;
&&height:&100%;
&&overflow:&
&&background-color:&#F8F8F8;
&&-webkit-transform:translate3d(0,0,0);
&&-webkit-backface-visibility:
}滑动方式：滑动开始时先将隐藏的下一个子页面拉到viewport右侧与当前子页面平行，然后紧接着两个子页面同步滑动，最后回归样式，中间的时间差事件均有JS控制（详见demo逻辑）四、三舞台双页视差滑动模拟动画效果见下图（上），分解逻辑图见下图（下）：DEMO地址：布局方式：这里我设定了三舞台(stage)的概念，其实就是当前viewport的左右侧各虚拟一个同样大小的viewport，当然，正常情况下我们只能看到当前舞台的子页面，leftstage是-100%的位置，rightstage是100%的位置，我们分别用三个class来定义：pageOld、pageInit、pageNew来代替.pageInt&{
&&-webkit-transform:&translateX(0);
&&&&&&&&&&transform:&translateX(0);
.pageOld&{
&&-webkit-transform:&translateX(-100%);
&&&&&&&&&&transform:&translateX(-100%);
.pageNew&{
&&-webkit-transform:&translateX(100%);
&&&&&&&&&&transform:&translateX(100%);
}滑动方式：1，定义正向（向左滑）和反向（向右滑）两个概念,；2，定义快速和慢速两个概念；则就是四种动态两种组合：正向快速+正向慢速、反向快速+反向慢速；.slideSlow&{
&&-webkit-transition:&-webkit-transform&400ms&cubic-bezier(0.42,&0,&0.58,&1.0)&0.1s;
&&&&&&-ms-transition:&transform&400ms&cubic-bezier(0.42,&0,&0.58,&1.0)&0.1s;
.slideFast&{
&&-webkit-transition:&-webkit-transform&300ms&cubic-bezier(0.42,&0,&0.58,&1.0);
&&&&&&-ms-transition:&transform&300ms&cubic-bezier(0.42,&0,&0.58,&1.0);
.slideSlowBack&{
&&-webkit-transition:&-webkit-transform&400ms&cubic-bezier(0.42,&0,&0.58,&1.0);
&&&&&&-ms-transition:&transform&400ms&cubic-bezier(0.42,&0,&0.58,&1.0);
.slideFastBack&{
&&-webkit-transition:&-webkit-transform&300ms&cubic-bezier(0.42,&0,&0.58,&1.0)&0.1s;
&&&&&&-ms-transition:&transform&300ms&cubic-bezier(0.42,&0,&0.58,&1.0)&0.1s;
}其中在三舞台视差滑动中的滑动曲线是经过数次的真机实验后找到的参数（cubic-bezier(0.42, 0, 0.58, 1.0)），这条曲线的滑动形态最接近iOS APP页面的滑动，希望对大家有用，鉴于时间精力有限，这四种模式只能从架构布局和样式设计层面探讨。
微信扫一扫
订阅每日移动开发及APP推广热点资讯公众号：CocoaChina
您还没有登录！请或
点击量11134点击量9353点击量8096点击量6379点击量5600点击量5537点击量5374点击量4930点击量4680
关注微信 每日推荐
扫一扫 浏览移动版
&2015 Chukong Technologies,Inc.
京公网安备89}