zaixianshouce
zaixianshouce

移动端安卓和IOS开发框架Framework7教程-侧栏

让我们看看如何添加侧栏。我们的APP可能包含两种侧栏,一个在左边,另一个在右边。我们应该在body的开始处添加侧栏的htmlbody:

  1. <body>
  2.     <!-- First, we need to add Panel's overlay that will overlays app while panel is opened -->
  3.     <div class="panel-overlay"></div>
  4.  
  5.     <!-- Left panel -->
  6.     <div class="panel panel-left">
  7.         ... panel content goes here ...
  8.     </div>
  9.  
  10.     <!-- Right panel -->
  11.     <div class="panel panel-right">
  12.         ... panel content goes here ...
  13.     </div>
  14.  
  15.     ...
  16. </body>
复制

在我们添加侧栏后,我们需要为每个侧栏选择打开效果。可能有两种效果:"Reveal"(侧栏从整个App的内容中移出)和"Cover"(侧栏覆盖App的内容)。如果您想要使用"Reveal"效果应该向侧栏添加 "panel-reveal" 类, 如果要使用"Cover"效果则添加 "panel-cover" 类:

  1. <body>
  2.     <!-- First, we need to add Panel's overlay that will overlays app while panel is opened -->
  3.     <div class="panel-overlay"></div>
  4.  
  5.     <!-- Left panel, let it be with reveal effect -->
  6.     <div class="panel panel-left panel-reveal">
  7.         ... panel content goes here ...
  8.     </div>
  9.  
  10.     <!-- Right panel, with cover effect -->
  11.     <div class="panel panel-right panel-cover">
  12.         ... panel content goes here ...
  13.     </div>
  14.  
  15.     ...
  16. </body>
复制

打开和关闭侧栏

从 HTML

Ok, 现在当我们的App里有侧栏,我们需要知道如何打开/关闭它们:

  • 为了打开侧栏，我们需要添加"open-panel" 类到任意HTML元素上(最好加到链接节点上)

    为了关闭侧栏，我们需要添加"close-panel" 类到任意HTML元素上(最好加到链接节点上)

  • 如果你的App里有两个侧栏，链接默认将打开/关闭左侧栏

  • 如果你想要指定哪个侧栏被开启/关闭,那么它可以通过HTML元素上额外的属性data-panel="left"完成。

根据以上注意点：

  1. <body>
  2.   <!-- Panels Overlay -->
  3.   <div class="panel-overlay"></div>
  4.  
  5.   <!-- Left Panel with Reveal effect -->
  6.   <div class="panel panel-left panel-reveal">
  7.     <div class="content-block">
  8.       <p>Left Panel content here</p>
  9.       <!-- Click on link with "close-panel" class will close panel -->
  10.       <p><a href="#" class="close-panel">Close me</a></p>
  11.       <!-- Click on link with "open-panel" and data-panel="right" attribute will open Right panel -->
  12.       <p><a href="#" data-panel="right" class="open-panel">Open Right Panel</a></p>
  13.     </div>
  14.   </div>
  15.  
  16.   <!-- Right Panel with Cover effect -->
  17.   <div class="panel panel-right panel-cover">
  18.     <div class="content-block">
  19.       <p>Right Panel content here</p>
  20.       <!-- Click on link with "close-panel" class will close panel -->
  21.       <p><a href="#" class="close-panel">Close me</a></p>
  22.       <!-- Click on link with "open-panel" and data-panel="left" attribute will open Left panel -->
  23.       <p><a href="#" data-panel="left" class="open-panel">Open Left Panel</a></p>
  24.     </div>
  25.   </div>
  26.  
  27.   ...
  28.   <div class="page-content">
  29.     <div class="content-block">
  30.       <!-- If no data-panel attribute, Left panel will be opened by default -->
  31.       <p><a href="#" class="open-panel">Open Left Panel</a></p>
  32.       <!-- Click on link with "open-panel" and data-panel="right" attribute will open Right panel -->
  33.       <p><a href="#" data-panel="right" class="open-panel">Open Right Panel</a></p>
  34.     </div>
  35.   </div>
  36.   ...
  37. </body>
复制

实例预览

使用 JavaScript

我们也可以通过使用JavaScript打开和关闭侧栏,为此我们需要查看相关的App方法：

myApp.openPanel(position) - 打开侧栏.

  • position - string - 侧栏打开的位置: "left" 或 "right". 必需.

myApp.closePanel() - 关闭最近打开的侧栏.

  1. <body>
  2.   <div class="panel-overlay"></div>
  3.   <div class="panel panel-left panel-reveal">
  4.     <div class="content-block">
  5.       <p>Left Panel content here</p>
  6.       <p><a href="#" class="panel-close">Close me</a></p>
  7.       <p><a href="#" class="open-right-panel">Open Right Panel</a></p>
  8.     </div>
  9.   </div>
  10.   <div class="panel panel-right panel-cover">
  11.     <div class="content-block">
  12.       <p>Right Panel content here</p>
  13.       <p><a href="#" class="panel-close">Close me</a></p>
  14.       <p><a href="#" class="open-left-panel">Open Left Panel</a></p>
  15.     </div>
  16.   </div>
  17.   ...
  18.     <div class="page-content">
  19.       <div class="content-block">
  20.         <p><a href="#" class="open-left-panel">Open Left Panel</a></p>
  21.         <p><a href="#" class="open-right-panel">Open Right Panel</a></p>
  22.       </div>
  23.     </div>
  24.   ...
  25.   <script>
  26.     var myApp = new Framework7();
  27.  
  28.     var $$ = Dom7;
  29.  
  30.     $$('.open-left-panel').on('click', function (e) {
  31.         // 'left' position to open Left panel
  32.         myApp.openPanel('left');
  33.     });
  34.  
  35.     $$('.open-right-panel').on('click', function (e) {
  36.         // 'right' position to open Right panel
  37.         myApp.openPanel('right');
  38.     });
  39.  
  40.     $$('.panel-close').on('click', function (e) {
  41.         myApp.closePanel();
  42.     });
  43.  
  44.   </script>
  45. </body>
复制

实例预览

Panel 事件

Panel事件对检测用户如何与你的侧栏交互，或者在侧栏打开/关闭时做一些JavaScript操作非常有用。

Event（事件） Target（目标） Description（描述）
open Panel Element<div class="panel"> 当侧栏的打开动画开始时，事件将被触发
opened Panel Element<div class="panel"> 当侧栏的打开动画结束时，事件将被触发
close Panel Element<div class="panel"> 当侧栏的关闭动画开始时，事件将被触发
closed Panel Element<div class="panel"> 当侧栏的关闭动画完成时，事件将被触发

这里有一个例子：

  1. var myApp = new Framework7();
  2.  
  3. var $$ = Dom7;
  4.  
  5. $$('.panel-left').on('opened', function () {
  6.     myApp.alert('Left panel opened!');
  7. });
  8. $$('.panel-left').on('close', function () {
  9.     myApp.alert('Left panel is closing!');
  10. });
  11. $$('.panel-right').on('open', function () {
  12.     myApp.alert('Right panel is opening!');
  13. });
  14. $$('.panel-right').on('closed', function () {
  15.     myApp.alert('Right panel closed!');
  16. });
复制

 实例预览

滑动屏幕打开侧栏

Framework7支持通过滑动手势打开侧栏。但有一个限制 —— 只有一个菜单能被设置成允许滑动屏幕打开 (左或右)。

要使用这个功能，我们需要在App初始化时设置相关参数：

  1. var myApp = new Framework7({
  2.     swipePanel: 'left'
  3. });
复制

 实例预览

There are also swipePanelCloseOpposite, swipePanelOnlyClose, swipePanelActiveArea, swipePanelNoFollow,swipePanelThreshold parameters that gives you more control over swipe panels. You can learn more about them in Initialize App section.

 

侧栏已经被打开？

有时候检测我们的一些侧栏是否是打开的是很有用的。这很容易,当一些菜单被打开时<body>将由以下规则生成被添加的类：with-panel-[position]-[effect]:

  • 如果你有带Cover效果的左侧栏打开着，body会有“with-panel-left-cover”类 <body class="with-panel-left-cover">

  • 如果你有带Reveal效果的左侧栏打开着, body 会有“with-panel-left-reveal”类 <body class="with-panel-left-reveal">

  • 如果你有带Cover效果的右侧栏打开着，body会有"with-panel-right-cover" 类  <body class="with-panel-right-cover">

  • 如果你有带Reveal效果的右侧栏打开着, body 会有"with-panel-right-reveal" 类 <body class="with-panel-right-reveal">

You can use it in JavaScript to detect opened panel:

  1. if ($$('body').hasClass('with-panel-left-cover')) {
  2.     console.log('Left Panel is opened')
  3. }
复制

或者在 CSS 定义额外的样式:

  1. /* Change Status Bar background when panel is opened */        
  2. body.with-panel-left-cover .statusbar-overlay{
  3.     background-color: #333;
  4. }
复制
 

 

你可能感兴趣的:(Framework7)

  • framework7使用记录 斯蒂芬加油啊
    1.在使用popover弹窗时，关闭弹窗方法，myApp.closeModal()2.获取元素css属性值，$$(".xxx").css("属性名","属性值")
  • 2018-10-09 007QQQQQQ
    SUI是一套基于bootstrap开发的前端组件库，同时她也是一套设计规范。通过SUI，可以非常方便的设计和实现精美的页面。SUIMobile是一套基于Framework7开发的UI库。它非常轻量、精美，只需要引入我们的CDN文件就可以使用，并且能兼容到iOS6.0+和Android4.0+，非常适合开发跨平台WebApp。
  • 二.移动端组件库 小茅同学
    Snipaste_2021-08-移动-56-38.png一.关于移动端组件库下面是AwesomeVue收集的一些优质的第三方组件库资源。UIframeworksformobileFramework7-Vue-BuildfullfeaturediOS&AndroidappsusingFramework7&Vue.vux-[Chinese]VueUIComponentsbasedonWeUI.vue
  • ef mysql 优化_C#实用杂记-EF全性能优化技巧 蛋蛋兽的一生 efmysql优化
    EntityFramework目前最新版本是6.1.3，当然EntityFramework7目前还是预览版，并不能投入正式生产环境，估计正式版16年第一季度会出来，了解过EF7的部分新特性后，还是狠狠期待一下滴。EF性能问题一直为开发者所诟病，最让人纠结的也是这块，所以此次我也来谈谈EF的性能优及建议。既然是把优化点列举出来，可能有些地方关于底层的知识就不会介绍的太深刻，权当抛砖引玉吧。先说说EF
  • Laravel学习笔记汇总——Laravel的目录结构 与非学堂 PHPLaravel学习记录phplaravel
    ##Laravel学习笔记汇总——Laravel的目录结构//使用下面语句查看当前版本：//phpartisan--version#LaravelFramework7.30.1.├──app#存放我们所开发应用的核心代码│├──Broadcasting#通过phpartisanmake:channel产生，存放所有broadcastchannelclasses│├──Console#所有应用中自定
  • 跨平台运行ASP.NET Core 1.0 weixin_34413065 运维网络git
    前言首先提一下微软更名后的叫法：ASP.NET5更名为ASP.NETCore1.0.NETCore更名为.NETCore1.0EntityFramework7更名为EntityFrameworkCore1.0或者简称EFCore1.0现在伴随着ASP.NETCore1.0RC2版的更新速度，许多官方文档都跟不上，还停留在RC1版的使用方式上（RC1版是继Beta版之后第一个发布的稳定版本）。RC1
  • 跨平台运行ASP.NET Core 1.0（转载） weixin_30685029 运维网络git
    前言首先提一下微软更名后的叫法：ASP.NET5更名为ASP.NETCore1.0.NETCore更名为.NETCore1.0EntityFramework7更名为EntityFrameworkCore1.0或者简称EFCore1.0现在伴随着ASP.NETCore1.0RC2版的更新速度，许多官方文档都跟不上，还停留在RC1版的使用方式上（RC1版是继Beta版之后第一个发布的稳定版本）。RC1
  • Swiper手动滑动后，自动滑动失效问题解决 Weastsea
    framework7框架访问地址:https://framework7.io/vue/swiper.htmlSwiperAPI:http://idangero.us/swiper/api/本代码使用framework7+vue框架，使用了SwiperAPI来解决轮播滑动问题。一开始代码是这样的，注意示例不能运行，调试时发现，页面加载出来的时候图片可以轮播，但是手动滑动之后，页面的图片不再自动轮播。
  • cordova-framework7-pushstate donotlb
    起因最近在开发一个app,技术栈是:cordova+framework7+vue,当把APP(android版)放到真机上运行时发现:返回键或者返回手势(全面屏)无法正常工作,会直接退出APP,这个问题的解决思路有两个:绑定backbutton事件-cordovadocs但是注意:该事件ios平台不支持启用pushstate,让webview的导航(前进/后退)功能生效framework7的作者推
  • python django restful框架_【2020Python修炼记】Django Rest Framework-1-DRF简介+RESTful入门规范... 曲水流觞不醉人 pythondjangorestful框架
    【目录】day11web开发模式2API接口3postman的使用4restful的规范5序列化/反序列化6DjangoRest_Framework7drf的安装和使用8cbv源码回顾1web开发模式在开发Web应用中，有两种应用模式：1.1前后端不分离1.2前后端分离2API接口-1=API接口的用处为了在团队内部形成共识、防止个人习惯差异引起的混乱，我们需要找到一种大家都觉得很好的接口实现规范
  • 分享一款自带工作流引擎的NodeJS全栈框架，接单快手、创业神器 zhennann Cabloynode.js
    CabloyJS是什么CabloyJS是一款自带工作流引擎的Node.js全栈框架,接单快手、创业神器,基于koa+egg+vue+framework7+mysql在线演示场景链接/二维码PC端https://test.cabloy.com/Mobile端谁会用这款Node.js全栈框架？>>>>>1.外包接单痛点：客户希望项目按质如期完工、价格低、风险小；服务商希望毛利高、投入少、进度快、客户满
  • FreamWork7-v3.0+GetStart 待业的无业游民
    1、下载安装freamWork7-v3.0+等版本。下载地址：FreamWork7下载链接地址图1下载界面2、创建自己的项目图2创建项目4、导入FreamWork7将解压的文件夹下的“packages”文件夹复制粘贴到新创建的项目中图3导入文件5、引用FreamWork7对应的JS和CS图4引入JS、CSS文件7、初始化Appvarapp=newFramework7({root:'#app',na
  • [SkylerAI]零碎知识点13-JS阻止事件冒泡和默认行为 SkylerAI
    参考链接：https://www.cnblogs.com/yuqingfamily/p/5940369.html亲测如下：Framework7中若使用以下方式绑定事件varbindings=[{element:".advertImg",event:"click",handler:function(){myApp.closeModal(popover);window.location.href="x
  • 常用网站收录 倔强的满腔热血
    前端框架amazeui移动端框架组件丰富http://amazeui.org/创建IOS风格的webAPP框架http://framework7.taobao.org/Bootstrap前端必备http://www.bootcss.com/类库Jquery类库http://jquery.cuishifeng.cn/知识体系前端知识体系http://www.cnblogs.com/sb1987102
  • Bootstrap框架 CNLISIYIII
    css框架：对css相同功能的整体封装，方便使用。常见css框架：AmazeUI；Framework7；Bootstrap（一）Bootstrap用于开发响应式布局、移动设备优先的web项目。1.下载安装两种版本：1）编译且压缩后的CSS、Js和字体文件，不包含文档和源码；2）less、Js和字体文件的源码，带有文档。（此处下载了Bootstrap3.3.7版本）安装：Bootstrap101Te
  • SUI Mobile Cherie_Young iOSsuisui-mobile
    1介绍1.1概念SUIMobile是一套基于Framework7开发的UI库。它非常轻量、精美，只需要引入CDN文件就可以使用，并且能兼容到iOS6.0+和Android4.0+，适合开发跨平台WebApp。SUIMobile是阿里巴巴一个UED团队的作品，目的是为了手机H5页面提供一个常用的组件库，减少重复工作。1.2特点轻量级SUIMobile非常轻量，核心库压缩zip后的体积总共只有52Ki
  • 【金三银四】2022 Android面经实录 i小灰
    复习点1、项目经历，业务，难点2、Java基础,JVM，集合原理3、Android基础,View体系，View绘制流程，事件分发，屏幕刷新，动画原理4、常见三方库原理5、Jetpack6、AndroidFramework7、算法8、Kotlin具体链接1算法部分打遍天下二叉树https://github.com/xfhy/Android-Notes/blob/master/Blogs/Algori
  • 基于python的django框架数码电子产品销售交易商城电商平台设计 biyezuopin djangopython电子商城系统购物商城毕业设计
    目录摘要I目录III第一章绪论11.1课题研究背景及意义11.2国内外研究现状21.3本文的主要工作3第二章技术选型42.1Python42.2Django52.3MySQL62.4DjangoRestFramework72.5Vue8第三章系统分析93.1可行性分析93.2系统需求分析103.2.1业务需求分析103.2.2用户需求113.2.3功能需求分析123.2.4非功能需求分析14第四章
  • JavaEE——SpringBoot项目常见的依赖包及其作用 留家里哦哦哦 javaspringbootjava-eemybatis
    SpringBoot项目常见的依赖包及其作用建立时，常导入依赖包如下：1.SpringWeb2.spring-boot-devtools：3.Lombok4.Thymeleaf5.MySQLDriver6.MybatisFramework7.还有额外的依赖包建立时，常导入依赖包如下：大家可以根据需求来导入自己想要的（一般中途想重新加入一个依赖包可以再pom.xml里面dependencies里面插
  • 基于Django图书管理系统设计与实践 biyezuopin pythonDjango图书管理系统图书管理毕业设计
    目录摘要IAbstractII1绪论11.1选题背景及意义11.1.1选题背景11.1.2目的意义11.2研究现状21.3论文组织安排32开发工具及其技术42.1Python42.2Django52.3MySQL62.4DjangoRestFramework73需求分析83.1可行性研究83.1.1技术可行性83.1.2经济上的可行性83.1.3操作上的可行性83.2系统需求分析83.3程序流程图
  • 仿华为电商商城，官网，华为超级新品日demo,大屏霸气且简洁 愛芳芳 前端开发它不香么vue.jselementuijavascript前端html5
    1.技术vue+elementui实现，elementui2.华为超级新品日官网华为商城是华为公司旗下官方电商平台3.官方截图4.项目demo效果图5.安装启动vue项目（一）Vue——如何创建一个Vue项目(完整步骤)-㭌（mou）七-博客园6.elementui官网Element-Theworld'smostpopularVueUIframework7.如果你下载的是本项目源码，则步骤一中可以
  • Spring Boot整合Zookeeper详细教程 怪 咖@ zookeeperspringbootjava-zookeeperzookeeper
    目录1.Curator介绍2.创建springboot项目3.引⼊Curator4.application.yml配置⽂件5.读取配置⽂件注入到容器6.注⼊CuratorFramework7.添加测试方法8.执行测试方法报错解决注意我这里用的是官方最稳定的版本3.7.1，版本之间有个别命令是有差距的！本篇文章的示例SpringBoot和Zookeeper客户端以及zookeeper都是最新版本！1
  • 移动端UI库 dg_dot 移动端
    SUIMobileSUIMobile是一套基于Framework7开发的UI库风格类似iOS轻量，核心库压缩Gzip后的JS、CSS网络传输体积总共只有52K提供了20+个常用的组件能兼容到iOS6.0+和Android4.0+非常适合开发跨平台WebApp基于jQuery3.x搭建，性能远远超越Zepto版本MUI最接近原生APP体验的高性能前端框架不依赖任何第三方JS库，压缩后的JS和CSS文
  • Framework7 [v2] + vue Web开发 非梦nj
    framework7-vuedata-tabledemo原来的OB管理系统，是用的Framework7v1，现在更新到v2了。所以，我们也重构一下。主要是界面对Mobile更加友好！re-designofhttps://ourbits.herokuapp.comdata-tableforframework7andvue,supportsorting,httpgetapi,paginationetc
  • 推荐前端的学习网站 陈光展_Gz
    框架类1.Framework7Framework7是一款免费、开源的移动HTML框架，主要用于开发混合手机App或者网页App，某些应用场景的体验几乎与原生开发的iOS和Android应用一模一样，同时也是一款不可获取的应用原型快速开发及展示工具。
  • Framework7 vanTu
    前言现在单页面应用的开发已经越来越多，要做一款用户体验较好的混合应用，实现快速开发，其中Framework7就是一款免费开源的UI框架，完美兼容iOS主题，给人带来原生般的体验。简单介绍Framework7所给你带来的用户体验是jqm不能比拟的，组件做得很精致，其中一个最主要的特色就页面右滑返回上一页面，这个特性就基本跟原生iOS一模一样。Framework7不依赖任何第三方库，这个是特别好的，在
  • Error in mounted hook: "TypeError: i[0] is undefined" 天涯笑笑生
    问题：使用framework7vue框架的ScrollableTabbar时，Tab1Tab2错误截图image.png模板源码{{item}}{{item}}注：1.此bug只在非ios平台上运行时才显示已排除其他因素影响解决方案：暂时未找到
  • iOS如何优雅的解决-webkit-overflow-scrolling css属性问题 桥下醉翁
    在iOS的H5页面中，总是受到UIScrollView的阻尼效果困扰，今天提供一个优雅的解决方案1、本操作针只支持WKWebView，如果使用UIWebView出现不稳定效果，只能等以后更新处理。2、本操作在framework7框架中初步测试，并未进行深度测试。//简单，优雅的解决方案代码在这里html,body{height:100%;position:fixed;overflow:hidden
  • Framework7(06:视图(View)间链接) 廖马儿
    前言：我们有两个已经初始化完成的View（leftview和rightview)。这种情况下，所有在leftview中的链接加载的页面都会放在leftview中，所有在rightview中的链接加载的页面都会放在rightview中。但是我们现在需要一些在leftview中的链接加载的页面放进rightview中。这叫View间链接。.router.load()和.router.back()方法。
  • Framework7(05: Page,路由,页面刷新) 廖马儿
    1.路由器JSAPIFramework7中的路由器使用非常灵活，他可以有多种方式来处理Page:AjaxPages,从一个指定的URL加载页面，通常是另外一个页面的文件地址（默认行为）。通过JSAPI创建和加载动态页面如果你的页面已经写在DOM中了，那么你可以直接使用内联页面，而不用再去加载。可以加载使用Template7编写的模板可以在你的应用中混合使用所有上面的这些方法。视图是应用中的一个独立
  • 怎么样才能成为专业的程序员？ cocos2d-x小菜 编程PHP
      如何要想成为一名专业的程序员？仅仅会写代码是不够的。从团队合作去解决问题到版本控制，你还得具备其他关键技能的工具包。当我们询问相关的专业开发人员，那些必备的关键技能都是什么的时候，下面是我们了解到的情况。   关于如何学习代码，各种声音很多，然后很多人就被误导为成为专业开发人员懂得一门编程语言就够了？！呵呵，就像其他工作一样，光会一个技能那是远远不够的。如果你想要成为
  • java web开发 高并发处理 BreakingBad javaWeb并发开发处理高
    java处理高并发高负载类网站中数据库的设计方法（java教程,java处理大量数据，java高负载数据） 一：高并发高负载类网站关注点之数据库 没错,首先是数据库,这是大多数应用所面临的首个SPOF。尤其是Web2.0的应用，数据库的响应是首先要解决的。 一般来说MySQL是最常用的，可能最初是一个mysql主机，当数据增加到100万以上，那么，MySQL的效能急剧下降。常用的优化措施是M-S（
  • mysql批量更新 ekian mysql
    mysql更新优化： 一版的更新的话都是采用update set的方式，但是如果需要批量更新的话，只能for循环的执行更新。或者采用executeBatch的方式，执行更新。无论哪种方式，性能都不见得多好。 三千多条的更新，需要3分多钟。 查询了批量更新的优化，有说replace into的方式，即： replace into tableName(id,status) values
  • 微软BI（3） 18289753290 微软BI SSIS
    1) Q：该列违反了完整性约束错误；已获得 OLE DB 记录。源:“Microsoft SQL Server Native Client 11.0” Hresult: 0x80004005 说明:“不能将值 NULL 插入列 'FZCHID'，表 'JRB_EnterpriseCredit.dbo.QYFZCH'；列不允许有 Null 值。INSERT 失败。”。 A：一般这类问题的存在是
  • Java中的List g21121 java
            List是一个有序的 collection（也称为序列）。此接口的用户可以对列表中每个元素的插入位置进行精确地控制。用户可以根据元素的整数索引（在列表中的位置）访问元素，并搜索列表中的元素。         与 set 不同，列表通常允许重复
  • 读书笔记 永夜-极光 读书笔记
       1.  K是一家加工厂,需要采购原材料,有A,B,C,D 4家供应商,其中A给出的价格最低,性价比最高,那么假如你是这家企业的采购经理,你会如何决策?          传统决策: A:100%订单  B,C,D:0%     &nbs
  • centos 安装 Codeblocks 随便小屋 codeblocks
    1.安装gcc,需要c和c++两部分,默认安装下,CentOS不安装编译器的,在终端输入以下命令即可yum install gccyum install gcc-c++   2.安装gtk2-devel,因为默认已经安装了正式产品需要的支持库,但是没有安装开发所需要的文档.yum install gtk2* 3. 安装wxGTK    yum search w
  • 23种设计模式的形象比喻 aijuans 设计模式
    1、ABSTRACT FACTORY—追MM少不了请吃饭了，麦当劳的鸡翅和肯德基的鸡翅都是MM爱吃的东西，虽然口味有所不同，但不管你带MM去麦当劳或肯德基，只管向服务员说“来四个鸡翅”就行了。麦当劳和肯德基就是生产鸡翅的Factory 　　工厂模式：客户类和工厂类分开。消费者任何时候需要某种产品，只需向工厂请求即可。消费者无须修改就可以接纳新产品。缺点是当产品修改时，工厂类也要做相应的修改。如：
  • 开发管理 CheckLists aoyouzi 开发管理 CheckLists
    开发管理 CheckLists(23) -使项目组度过完整的生命周期 开发管理 CheckLists(22) -组织项目资源 开发管理 CheckLists(21) -控制项目的范围开发管理 CheckLists(20) -项目利益相关者责任开发管理 CheckLists(19) -选择合适的团队成员开发管理 CheckLists(18) -敏捷开发 Scrum Master 工作开发管理 C
  • js实现切换 百合不是茶 JavaScript栏目切换
    js主要功能之一就是实现页面的特效,窗体的切换可以减少页面的大小,被门户网站大量应用思路: 1,先将要显示的设置为display:bisible 否则设为none 2,设置栏目的id ,js获取栏目的id,如果id为Null就设置为显示 3,判断js获取的id名字;再设置是否显示   代码实现:   html代码: <di
  • 周鸿祎在360新员工入职培训上的讲话 bijian1013 感悟项目管理人生职场
            这篇文章也是最近偶尔看到的，考虑到原博客发布者可能将其删除等原因，也更方便个人查找，特将原文拷贝再发布的。“学东西是为自己的，不要整天以混的姿态来跟公司博弈，就算是混，我觉得你要是能在混的时间里，收获一些别的有利于人生发展的东西，也是不错的，看你怎么把握了”，看了之后，对这句话记忆犹新。  &
  • 前端Web开发的页面效果 Bill_chen htmlWebMicrosoft
    1.IE6下png图片的透明显示： <img src="图片地址" border="0" style="Filter.Alpha(Opacity)=数值(100),style=数值(3)"/> 或在<head></head>间加一段JS代码让透明png图片正常显示。 2.<li>标
  • 【JVM五】老年代垃圾回收：并发标记清理GC(CMS GC) bit1129 垃圾回收
      CMS概述 并发标记清理垃圾回收(Concurrent Mark and Sweep GC）算法的主要目标是在GC过程中，减少暂停用户线程的次数以及在不得不暂停用户线程的请夸功能，尽可能短的暂停用户线程的时间。这对于交互式应用，比如web应用来说，是非常重要的。   CMS垃圾回收针对新生代和老年代采用不同的策略。相比同吞吐量垃圾回收，它要复杂的多。吞吐量垃圾回收在执
  • Struts2技术总结 白糖_ struts2
      必备jar文件 早在struts2.0.*的时候，struts2的必备jar包需要如下几个： commons-logging-*.jar   Apache旗下commons项目的log日志包 freemarker-*.jar          
  • Jquery easyui layout应用注意事项 bozch jquery浏览器easyuilayout
    在jquery easyui中提供了easyui-layout布局，他的布局比较局限，类似java中GUI的border布局。下面对其使用注意事项作简要介绍：      如果在现有的工程中前台界面均应用了jquery easyui，那么在布局的时候最好应用jquery eaysui的layout布局，否则在表单页面（编辑、查看、添加等等）在不同的浏览器会出
  • java-拷贝特殊链表：有一个特殊的链表，其中每个节点不但有指向下一个节点的指针pNext，还有一个指向链表中任意节点的指针pRand，如何拷贝这个特殊链表？ bylijinnan java
    public class CopySpecialLinkedList { /** * 题目：有一个特殊的链表，其中每个节点不但有指向下一个节点的指针pNext，还有一个指向链表中任意节点的指针pRand，如何拷贝这个特殊链表？ 拷贝pNext指针非常容易，所以题目的难点是如何拷贝pRand指针。 假设原来链表为A1 -> A2 ->... -> An，新拷贝
  • color Chen.H JavaScripthtmlcss
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"  "http://www.w3.org/TR/html4/loose.dtd">    <HTML>    <HEAD>&nbs
  • [信息与战争]移动通讯与网络 comsci 网络
          两个坚持:手机的电池必须可以取下来                光纤不能够入户,只能够到楼宇       建议大家找这本书看看:<&
  • oracle flashback query(闪回查询) daizj oracleflashback queryflashback table
    在Oracle 10g中，Flash back家族分为以下成员： Flashback Database Flashback Drop Flashback Table Flashback Query(分Flashback Query,Flashback Version Query，Flashback Transaction Query) 下面介绍一下Flashback Drop 和Flas
  • zeus持久层DAO单元测试 deng520159 单元测试
    zeus代码测试正紧张进行中,但由于工作比较忙,但速度比较慢.现在已经完成读写分离单元测试了,现在把几种情况单元测试的例子发出来,希望有人能进出意见,让它走下去. 本文是zeus的dao单元测试: 1.单元测试直接上代码   package com.dengliang.zeus.webdemo.test; import org.junit.Test; import o
  • C语言学习三printf函数和scanf函数学习 dcj3sjt126com cprintfscanflanguage
    printf函数 /* 2013年3月10日20:42:32 地点：北京潘家园 功能： 目的： 测试%x %X %#x %#X的用法 */ # include <stdio.h> int main(void) { printf("哈哈！\n"); // \n表示换行 int i = 10; printf
  • 那你为什么小时候不好好读书? dcj3sjt126com life
    dady, 我今天捡到了十块钱, 不过我还给那个人了 good girl! 那个人有没有和你讲thank you啊 没有啦....他拉我的耳朵我才把钱还给他的, 他哪里会和我讲thank you   爸爸, 如果地上有一张5块一张10块你拿哪一张呢.... 当然是拿十块的咯... 爸爸你很笨的, 你不会两张都拿   爸爸为什么上个月那个人来跟你讨钱, 你告诉他没
  • iptables开放端口 Fanyucai linuxiptables端口
    1，找到配置文件 vi /etc/sysconfig/iptables   2，添加端口开放，增加一行，开放18081端口 -A INPUT -m state --state NEW -m tcp -p tcp --dport 18081 -j ACCEPT   3，保存 ESC :wq!   4，重启服务 service iptables
  • Ehcache（05）——缓存的查询 234390216 排序ehcache统计query
    缓存的查询 目录 1.    使Cache可查询 1.1     基于Xml配置 1.2     基于代码的配置 2     指定可搜索的属性 2.1     可查询属性类型 2.2 &
  • 通过hashset找到数组中重复的元素 jackyrong hashset
      如何在hashset中快速找到重复的元素呢?方法很多，下面是其中一个办法： int[] array = {1,1,2,3,4,5,6,7,8,8}; Set<Integer> set = new HashSet<Integer>(); for(int i = 0
  • 使用ajax和window.history.pushState无刷新改变页面内容和地址栏URL lanrikey history
    后退时关闭当前页面 <script type="text/javascript"> jQuery(document).ready(function ($) {         if (window.history && window.history.pushState) {
  • 应用程序的通信成本 netkiller.github.com 虚拟机应用服务器陈景峰netkillerneo
    应用程序的通信成本 什么是通信 一个程序中两个以上功能相互传递信号或数据叫做通信。 什么是成本 这是是指时间成本与空间成本。 时间就是传递数据所花费的时间。空间是指传递过程耗费容量大小。 都有哪些通信方式 全局变量 线程间通信 共享内存 共享文件 管道 Socket 硬件（串口，USB） 等等 全局变量 全局变量是成本最低通信方法，通过设置
  • 一维数组与二维数组的声明与定义 恋洁e生 二维数组一维数组定义声明初始化
    /**  *  */ package test20111005; /**  * @author FlyingFire  * @date:2011-11-18 上午04:33:36  * @author ：代码整理  * @introduce :一维数组与二维数组的初始化  *summary：  */ public c
  • Spring Mybatis独立事务配置 toknowme mybatis
    在项目中有很多地方会使用到独立事务，下面以获取主键为例   （1）修改配置文件spring-mybatis.xml  <!-- 开启事务支持 -->  <tx:annotation-driven transaction-manager="transactionManager" />   &n
  • 更新Anadroid SDK Tooks之后，Eclipse提示No update were found xp9802 eclipse
    使用Android SDK Manager 更新了Anadroid SDK Tooks 之后， 打开eclipse提示 This Android SDK requires Android Developer Toolkit version 23.0.0 or above, 点击Check for Updates  检测一会后提示 No update were found 
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他