@media (max-width: 767px)

.main-sidebar, .left-side {

  -webkit-transform: translate(-230px, 0);

  -ms-transform: translate(-230px, 0);

  -o-transform: translate(-230px, 0);

  transform: translate(-230px, 0);

}
@media (max-width: 767px)

.sidebar-open .main-sidebar, .sidebar-open .left-side {

  -webkit-transform: translate(0, 0);

  -ms-transform: translate(0, 0);

  -o-transform: translate(0, 0);

  transform: translate(0, 0);

}

　　

webapp 侧边导航效果的更多相关文章

  1. jQuery实现侧边导航栏效果

    效果图: 效果体验:http://keleyi.com/keleyi/phtml/jqmenu/2.htm 以下是完整代码: <!DOCTYPE html> <html> &l ...

  2. Android 新兴的UI模式——侧边导航栏【转】

    侧边导航栏也就是大家熟知的SliddingMenu,英文也叫Fly-In App Menu.Side Navigation等.当然谷歌现在已经推出类似这个效果的组件--Navigation Drawe ...

  3. 【源码分享】jquery+css实现侧边导航栏

    jquery+css实现侧边导航栏 最近做项目的时候,突然想用一个侧边导航栏,网上找了几个插件,有的太丑而且不太符合我的预期.与其修改别人的代码,不如自己来写一个了.废话不多说先上图,感兴趣的请继续看 ...

  4. [置顶] bootstrap自定义样式-bootstrap侧边导航栏的实现

    前言 bootstrap自带的响应式导航栏是向下滑动的,有时满足不了个性化的需求,需要做一个类似于android drawerLayout 侧滑的菜单,这就是我要实现的bootstrap自定义侧滑菜单 ...

  5. 【机器学习实践】Jupyter Notebook安装 侧边导航栏功能 操作及其他常用扩展功能介绍

    安装过程:  1. 首先我们引入jupyter_contrib_nbextension这个第三方库. 2. 在Anaconda Promot中输入命令: pip install jupyter_con ...

  6. html+css写出响应式侧边导航栏

    html部分:先写用div画好六个导航的卡片,再利用css添加响应效果 <div class='card-holder'> <div class='card-wrapper'> ...

  7. 学习使用 CSS3 制作网站面包屑导航效果

    作为最重要的导航展示形式之一,面包屑导航能够让用户更清楚的知道他们所在页面的层次结构,让他们可以方便的导航到上一层页面.在本教程中,您将学习如何使用 CSS3 技术创建自己的面包屑导航效果. 效果演示 ...

  8. 基于 jQuery 实现的精致作品集图片导航效果

    今天,我们要用 jQuery 来创建一个作品集图像的导航模板.我们的想法是,以分组的方式显示一组作品集,并通过二维的方式(水平/垂直)来浏览.任一箭头或当前图像下方的小盒子可以作为导航使用. 在线演示 ...

  9. Pace.js – 超赞的页面加载进度自动指示和 Ajax 导航效果

    在页面中引入 Pace.js  和您所选择主题的 CSS 文件,就可以让你的页面拥有漂亮的加载进度和 Ajax 导航效果.不需要挂接到任何代码,自动检测进展.您可以选择颜色和多种效果,有简约,闪光灯, ...

随机推荐

  1. iOS中图片动画的三种模式及基本的代码实现

    -(void)play { //第一种图片动画模式 头尾方式 //头尾方式 [UIView beginAnimations:nil context:nil];//动画开始 [UIView setAni ...

  2. APK瘦身实践

    首发地址:http://www.jayfeng.com/2015/12/29/APK%E7%98%A6%E8%BA%AB%E5%AE%9E%E8%B7%B5/ 因为推广的需要,公司需要把APK的大小再 ...

  3. poj3642 01背包

    http://poj.org/problem?id=3624 #include<iostream> #include<cstdio> #include<algorithm ...

  4. DSP using MATLAB 示例Example2.3

    n = [-10:1:10]; alpha = -0.1+0.3j; % x = exp(alpha*n); % subplot(2,1,1); set(gcf,'Color',[1,1,1]) % ...

  5. express－11 表单处理(2)

    处理AJAX表单 用Express处理AJAX表单非常简单:甚至可以使用相同的处理程序来处理AJAX请求和常规的浏览器回退. HTML文件 (/views/newsletter.handlebars) ...

  6. [技术学习]js正则表达式汇总

    一.常用正则表达式关键字 ".":任意字符 "*":任意个数 "+":任意个数,至少一个 "?":0-1个 " ...

  7. JavaScript定时器

    定时器 开启定时器 Setinterval间隔型    每隔一段时间重复的执行 SetTimeout延时型   只执行一次 两种定时器的区别 <!DOCTYPE html> <htm ...

  8. BZOJ1701 : [Usaco2007 Jan]Cow School牛学校

    枚举剩下的分数个数$k$,设最高的$k$个分数和的分子分母分别为$U$和$D$. 那么在选了的里面找到$A=\min(Dt[x]-Up[x])$,没选的里面找到$B=\max(Dt[x]-Up[x]) ...

  9. 20145308刘昊阳 《Java程序设计》实验二 Java面向对象程序设计 实验报告

    20145308刘昊阳 <Java程序设计>实验二 Java面向对象程序设计 实验报告 实验名称 Java面向对象程序设计 实验内容 初步掌握单元测试和TDD 理解并掌握面相对象三要素:封 ...

  10. Leetcode Validate Binary Search Tree

    Given a binary tree, determine if it is a valid binary search tree (BST). Assume a BST is defined as ...