F2E前端爱好者
F2E前端爱好者

animate.css 实现移动端垂直滑动效果

html:


<html>
    <head>
        <meta charset="UTF-8">
        <title>title>
        <link rel="stylesheet" type="text/css" href="css/swiper.min.css"/>
        <link rel="stylesheet" type="text/css" href="css/animate.css"/>
        <script src="js/jquery-2.2.3.min.js" type="text/javascript" charset="utf-8">script>
        <script src="js/swiper.jquery.min.js" type="text/javascript" charset="utf-8">script>
        <script src="js/swiper.animate1.0.2.min.js" type="text/javascript" charset="utf-8">script>
        <style type="text/css">
            * {
                margin: 0;
                padding: 0;
            }
            body{
                font-size:16px;
            }
          .swiper-wrapper {
            -webkit-perspective: 1200px;
            -moz-perspective: 1200px;
            -ms-perspective: 1200px;
            perspective: 1200px;
          }
          .swiper-slide {
            position: relative;
            -webkit-transform-style: preserve-3d;
            -moz-transform-style: preserve-3d;
            -ms-transform-style: preserve-3d;
            transform-style: preserve-3d;
           background-size:100% auto;
           overflow:hidden;
           text-align:center;
           line-height:300px;
          }
        .swiper-slide img{
            width:100%;
            height: 100%;
        }
        .tc{
            text-align: center;
        }
        .mc{
            margin: 0 auto;
        }
        .tl{
            text-align: left;
        }
        .tr{
            text-align: right;
        }
        .rel{position: relative;}
        .abs{position: absolute;}
        .l{float: left;}
        .r{float: right;}
        .abs-c{position: absolute;width:100%;left: 50%;margin-left: -50%;}
        .col-white{color: #fff;}
        .col-blue{color:blue;}
        .col-purple{color:purple;}
        .col-orange{color:orange;}
        .ft16{font-size: 2em;}
        .ft18{font-size: 3em;}
        .ft20{font-size: 4em;}
        .ft22{font-size: 5em;}
        .lineheight25{line-height: 2em;}

        style>
    head>
    <body>
    <div style="width:100%;margin:0 auto;">
    <div class="swiper-container">
      <div class="swiper-wrapper">
      <div class="swiper-slide">
        <img src="img/zhiling1.jpg" >
            <h1 class="ani abs-c col-white ft22 " swiper-animate-effect="fadeInDown" swiper-animate-duration="0.5s" swiper-animate-delay="0.3s" style="top:0" >关于我们h1>
            <p class=" ani abs-c col-white ft18  lineheight25" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.5s" swiper-animate-delay="0.3s"  style="top:300px;">
                赖家大院是集休闲娱乐、养老住宿、餐饮的一个休闲农庄，农庄内设有自动棋牌室、餐厅、可钓鱼、春天看桃花、夏季摘桃子。距离黄龙溪几分钟车程就能感受这座古老而有富有现代化气息的乡镇。 同时到本农庄也是非常方便，空气清新，景色宜人，这样好的空气和环境人都要多活好几年。受够了城市空气的你是不是也想来体验下，住了一次你就会爱上乡下的空气和氛围。同时本农庄的建筑 类似别野，每层单独设阳台可以喝茶聊天，早晨看日出，傍晚看日出，想想就有多惬意。如果你也想体验赶紧联系我们。
            p>
      div>
        <div class="swiper-slide"><img src="img/zhiling2.jpg" >div>
        <div class="swiper-slide"><img src="img/zhiling3.jpg" >div>
      div>
    div>
    div>


     <script src="js/ziling.js" type="text/javascript" charset="utf-8">script>
    body>
html>

js


function fixPagesHeight() {
    $('.swiper-slide,.swiper-container').css({
        height: $(window).height(),
    })
}
$(window).on('resize', function() {
    fixPagesHeight();
})
fixPagesHeight();

var mySwiper = new Swiper('.swiper-container', {

    direction: 'vertical',
    lazyLoading : true,
    mousewheelControl: false,
    watchSlidesProgress: true,
    onInit: function(swiper) {
        swiper.myactive = 0;
        swiperAnimateCache(swiper); //隐藏动画元素 
        swiperAnimate(swiper); //初始化完成开始动画
    },
    onSlideChangeEnd: function(swiper){ 
        swiperAnimate(swiper); //每个slide切换结束时也运行当前slide动画
    },
    onProgress: function(swiper) {
        for (var i = 0; i < swiper.slides.length; i++) {
            var slide = swiper.slides[i];
            var progress = slide.progress;
            var translate, boxShadow;

            translate = progress * swiper.height * 0.8;
            scale = 1 - Math.min(Math.abs(progress * 0.2), 1);
            boxShadowOpacity = 0;

            slide.style.boxShadow = '0px 0px 10px rgba(0,0,0,' + boxShadowOpacity + ')';

            if (i == swiper.myactive) {
                es = slide.style;
                es.webkitTransform = es.MsTransform = es.msTransform = es.MozTransform = es.OTransform = es.transform = 'translate3d(0,' + (translate) + 'px,0) scale(' + scale + ')';
                es.zIndex=0;


            }else{
                es = slide.style;
                es.webkitTransform = es.MsTransform = es.msTransform = es.MozTransform = es.OTransform = es.transform ='';
                es.zIndex=1;

            }

        }

    },


    onTransitionEnd: function(swiper, speed) {
        for (var i = 0; i < swiper.slides.length; i++) {
        //  es = swiper.slides[i].style;
        //  es.webkitTransform = es.MsTransform = es.msTransform = es.MozTransform = es.OTransform = es.transform = '';

        //  swiper.slides[i].style.zIndex = Math.abs(swiper.slides[i].progress);


        }

        swiper.myactive = swiper.activeIndex;

    },
    onSetTransition: function(swiper, speed) {

        for (var i = 0; i < swiper.slides.length; i++) {
            //if (i == swiper.myactive) {

                es = swiper.slides[i].style;
                es.webkitTransitionDuration = es.MsTransitionDuration = es.msTransitionDuration = es.MozTransitionDuration = es.OTransitionDuration = es.transitionDuration = speed + 'ms';
            //}
        }

    }

});

你可能感兴趣的:(css3,jquery,bootstrap)

  • 【无标题】 是懒羊羊吖～ 笔记
    一.WED前端应用软件：c/s架构b/s架构web前端：html5css3javascripthtml5：超文本标记语言----超链接，文字，标签标签语法规范：结束-----双标签标签体------可以嵌套inputimg---------单标签属性：定制元素的行为，属性是不通用的，每一个标签存在自身的属性，当属性名等于属性值时,只需要写属性名，不需要写属性值。二.HTML1.样式//文档声明：告
  • jQuery UI CSS 框架 API lly202406 开发语言
    jQueryUICSS框架API概述jQueryUI是一个基于jQuery的用户界面和交互库，它提供了一套丰富的交互组件和视觉效果，旨在帮助开发者快速构建具有吸引力和互动性的网页应用。jQueryUICSS框架API是jQueryUI的一部分，它允许开发者通过简单的CSS类来控制UI组件的样式和外观。本文将详细介绍jQueryUICSS框架API的使用方法、常用类和功能，帮助开发者更好地利用这一工
  • vue面试题|[2025-1-10] ○陈 vue面试题vue.jsjavascript前端
    1.vue和jquery的区别是什么？1.原理不同vue就是数据绑定；jq是先获取dom再处理2.着重点不同vue是数据驱动，jq是着重于页面3.操作不同4.未来发展不同2.vuex的响应式处理vuex是vue的状态管理工具vue中可以直接触发methods中的方法，vuex是不可以的。处理异步，当触发事件的时候，会通过dispatch来访问actions中的方法，actions中的commit会
  • electron学习笔记 weixin_46452138 electron学习javascript
    electron个人学习笔记一、electron简单了解Electron是一个跨平台的、基于Web前端技术的桌面GUI应用程序开发框架。可以使用HTML、CSS来绘制界面和控制布局，使用JavaScript来控制用户行为和业务逻辑，使用Node.js来通信、处理音频视频等，几乎所有的Web前端技术和框架（jQuery、Vue、React、Angular等）都可以应用到桌面GUI开发中。二、开发前基
  • java脚本弹出输入框,使用弹出框编辑(增加)表单内容 jordan.xue java脚本弹出输入框
    0、背景使用Amazeui中Prompt模态窗口Modal1、JQuery功能：表单复位获取表单的值，并显示在修改弹出框中(文本框、单选、多选、下拉框)发送Post异步请求给后台自刷新$(function(){//编辑功能$('table.edit').on("click",function(){//表单复位document.getElementById("form-machineRole").r
  • 【Python自动化办公脚本】Excel文件批量转PDF文件 一只小哪吒AE python
    importosimportwin32com.clientimporttkinterastkfromtkinterimportttkfromttkbootstrapimportStylefromtkinterimportfiledialog,messageboxfromthreadingimportThreadclassExcelToPDFConverter:def__init__(self,ma
  • HTML5+CSS3【容器元素、 HTML5新增布局标签、视频和音频 、HTML5新增标签】(五)-全面详解（学习总结---从入门到深化） 童小纯 前端系列---从入门到深化css3html5
    作者简介：大家好，我是小童，Java开发工程师，CSDN博客博主，Java领域新星创作者系列专栏：前端、Java、Java中间件大全、微信小程序、微信支付、若依框架、Spring全家桶如果文章知识点有错误的地方，请指正！和大家一起学习，一起进步如果感觉博主的文章还不错的话，请三连支持一下博主哦博主正在努力完成2023计划中：以梦为马，扬帆起航，2023追梦人目录容器元素（div）学习效果反馈HTM
  • Bootstrap CSS 概览 froginwe11 开发语言
    BootstrapCSS概览引言Bootstrap是一个流行的前端框架，它可以帮助开发者快速构建响应式、移动优先的网站和应用程序。Bootstrap使用CSS、HTML和JavaScript来构建界面，其中CSS部分提供了丰富的样式和组件，使得开发者可以轻松实现各种设计效果。本文将为您提供一个关于BootstrapCSS的概览，帮助您了解其核心功能和用法。BootstrapCSS简介Bootstr
  • jQuery AJAX 方法详解 froginwe11 开发语言
    jQueryAJAX方法详解引言随着互联网技术的不断发展，前端开发领域的技术也在不断更新迭代。jQuery作为一种广泛使用的前端JavaScript库，极大地简化了DOM操作和事件处理。在众多jQuery功能中，AJAX（AsynchronousJavaScriptandXML）方法尤为突出，它允许我们在不重新加载整个页面的情况下与服务器进行异步通信。本文将详细介绍jQueryAJAX方法的使用，
  • 【Elasticsearch源码解读】代码包结构概述 risc123456 elasticsearch
    Elasticsearch的代码库包含多个包，每个包负责不同的功能。以下是这些包的主要功能：####action封装了Elasticsearch的各种操作，如索引、搜索、删除等，提供了与集群交互的接口。####bootstrap包含启动Elasticsearch节点所需的引导程序，负责初始化环境和配置。####client/internal提供客户端与Elasticsearch集群交互的内部实现，
  • 基于Java毕业设计学术会议论文稿件管理系统源码+系统+mysql+lw文档+部署软件 练练科技 java课程设计mysql
    基于Java毕业设计学术会议论文稿件管理系统源码+系统+mysql+lw文档+部署软件基于Java毕业设计学术会议论文稿件管理系统源码+系统+mysql+lw文档+部署软件本源码技术栈：项目架构：B/S架构开发语言：Java语言开发软件：ideaeclipse前端技术：Layui、HTML、CSS、JS、JQuery等技术后端技术：JAVA运行环境：Win10、JDK1.8数据库：MySQL5.7
  • java计算机毕业设计web实验室课表管理系统源码+mysql数据库+系统+lw文档+部署 花样1999 mysql数据库java
    java计算机毕业设计web实验室课表管理系统源码+mysql数据库+系统+lw文档+部署java计算机毕业设计web实验室课表管理系统源码+mysql数据库+系统+lw文档+部署本源码技术栈：项目架构：B/S架构开发语言：Java语言开发软件：ideaeclipse前端技术：Layui、HTML、CSS、JS、JQuery等技术后端技术：JAVA运行环境：Win10、JDK1.8数据库：MySQ
  • java计算机毕业设计运动会管理系统源码+mysql数据库+系统+lw文档+部署 沪港 mysqljava数据库
    java计算机毕业设计运动会管理系统源码+mysql数据库+系统+lw文档+部署java计算机毕业设计运动会管理系统源码+mysql数据库+系统+lw文档+部署本源码技术栈：项目架构：B/S架构开发语言：Java语言开发软件：ideaeclipse前端技术：Layui、HTML、CSS、JS、JQuery等技术后端技术：JAVA运行环境：Win10、JDK1.8数据库：MySQL5.7/8.0源码
  • 【Three.js】JS 3D library（一个月进化史） Tiffany_Ho 前端Three.js
    #春节过完了，该继续投入学习了~作为一个平面开发者，想要增进更多的技能，掌握web3D开发#前置知识与技能1.JavaScript基础-掌握ES6+语法（类、模块、箭头函数、解构等）-熟悉异步编程（Promise、async/await）-了解事件循环和DOM操作2.HTML5和CSS3-熟悉Canvas和WebGL的基础概念-了解CSS3动画和变换（transform、transition）3.
  • ASP.NET MVC5配置百度富文本编辑器 plcc123 ASP.NETMVCc#
    简单说一下，.netMVC5如何配置百度富文本编辑器吧。1、首先去下载百度富文本编辑器2、解压放到项目文件夹Content/ueditor3、在视图里面添加@Scripts.Render("~/bundles/jqueryval","~/Content/ueditor/ueditor.config.js","~/Content/ueditor/editor_api.js","~/Content/u
  • NVRAM配置文件，Flash系统映像，BootROM硬件初始值，SDRAM内存 顺漆自然 智能路由器
    企业级路由器的初始配置文件通常保存在NVRAM（非易失性随机存取存储器）上。因此，本题的答案是B.NVRAM。NVRAM是一种特殊的内存类型，它可以在系统关闭或断电的情况下保持数据。路由器启动时，会从ROM中的Bootstrap程序开始，然后查找NVRAM中的配置文件以继续启动过程。这样可以确保即使在系统关闭或断电后，路由器也能恢复到其先前的配置状态。正确答案是B.NVRAM（非易失性随机访问存储
  • 表格首列，首行固定，并且能随意滚动 一麻袋小猫 笔记css3
    css3新增了粘性定位，利用粘性定位即可做到，但要注意的是：如果想要粘性定位相对于父元素定位，需要给其增加relative定位。逻辑是：滚动盒子滚动的是页面，滚动盒子内部放一个大盒子（1），此盒子宽度为内容的总宽度，在盒子内部给想要固定的盒子增加粘性定位，让其top值||left值为0，这里的0是相对于盒子1的。
  • 2021-04-15 一般橙 笔记
    JQuery项目JS模块化分析(一)Jquery在线手册新增一个组件例按钮组件varYIUI=YIUI||{};(function(){//立即执行匿名函数,模拟模块化YIUI.Yes_Button=function(options){//匿名函数表达式varbtntemplate={el:$(""),caption:"按钮",init:function(){varself=this;var$in
  • 阿里云视频点播，基于thinkphp8上传视频 quweiie php阿里云音视频云计算
    前端参考官方示例(jQuery版)阿里云JavaScript上传SDKDemo(使用jquery).container{width:1200px;margin:0auto;}.input-control{margin:5px0;}.input-controllabel{font-size:14px;color:#333;width:30%;text-align:right;display:inli
  • 手搓操作系统-如何创建虚拟磁盘并装载内核(超详细版） Refulic. linuxbootstrap系统架构系统安全
    写在前面：本篇是完整的在Linux环境下，创建一个虚拟磁盘，并且将内核安装到磁盘并用虚拟机运行的过程。需要对bootstrap过程有一定的基础知识。遇到不懂的概念，如MBR，Grub等请务必参考笔者的另一篇文章操作系统架构-Linux主机从按下电源键到加载内核，都经历了什么？（超详细版）此外，读者还需要对文件系统有基本的理解。1.创建磁盘镜像1）通过在Shell提示符下输入以下命令创建磁盘镜像（提
  • html元素后追加内容,jquery 元素控制(追加元素/追加内容)介绍及应用 王大明白 html元素后追加内容
    一、在元素内部/外部追加元素append,prepend:添加到子元素before，after：作为兄弟元素添加html：在我的后面追加一条新闻Javascript:jQuery(function(){//在元素内部追加内容$("#content").append("姚明退役了...");})在#content里面添加元素，这是把姚明退役了...作为子元素添加到#content，如果想在元素外部追
  • 前端知识速记--css篇：CSS3中的常见动画及实现方式 无限大. #前端知识速记前端csscss3
    前端知识速记–css篇：CSS3中的常见动画及实现方式常见的CSS3动画1.过渡(Transitions)过渡是一种非常简单的动画效果，允许你在元素的状态变更时平滑过渡到新状态。语法格式：transition:propertydurationtiming-functiondelay;property：指定要过渡的CSS属性，例如background-color。duration：过渡的持续时间，例
  • CSS动画与变形 玲玲酱 #CSS3前端html5css3
    CSS动画-Animations由于该技术的规范还没有稳定，在使用前要先确保浏览器对其兼容性。Animations是css3的一个模块，使用keyframes定义如何随着时间的移动改变CSS的属性值，可以通过指定它们的持续时间，重复次数，如何重复来控制关键帧的行为。Animations由两部分组成：css动画的配置，以及一系列的keyframes（用来描述动画的开始、过程、结束状态）。不需要了解任
  • CSS3动画属性：转换(transition) 前端独秀 前端css3transition
    W3C标准中对css3的transition这是样描述的：“css的transition允许css的属性值在一定的时间区间内平滑地过渡。这种效果可以在鼠标单击、获得焦点、被点击或对元素任何改变中触发，并圆滑地以动画效果改变CSS的属性值。”transition主要包含四个属性值：执行变换的属性：transition-property,变换延续的时间：transition-duration,在延续时
  • 大数据知识图谱之深度学习——基于BERT+LSTM+CRF深度学习识别模型医疗知识图谱问答可视化系统_bert+lstm 2301_76348014 程序员深度学习大数据知识图谱
    文章目录大数据知识图谱之深度学习——基于BERT+LSTM+CRF深度学习识别模型医疗知识图谱问答可视化系统一、项目概述二、系统实现基本流程三、项目工具所用的版本号四、所需要软件的安装和使用五、开发技术简介Django技术介绍Neo4j数据库Bootstrap4框架Echarts简介NavicatPremium15简介Layui简介Python语言介绍MySQL数据库深度学习六、核心理论贪心算法A
  • Bootstrap4 信息提示框 lsx202406 开发语言
    Bootstrap4信息提示框Bootstrap是一个流行的前端框架，它提供了一系列的工具和组件来帮助开发者快速搭建响应式网站。在Bootstrap4中，信息提示框（Tooltip）是一个非常有用的组件，它可以帮助用户更好地理解页面上的元素。本文将详细介绍Bootstrap4的信息提示框组件，包括其基本用法、配置选项以及与实际应用的结合。一、基本用法1.1HTML结构要使用Bootstrap4的信
  • Netty UDP 客户端发消息后接收服务器信息 一顿敲代码的小朋 nettyjava
    在本站大神的文章的基础上，加入了我的项目需求,当客户端用UDP给服务端发送消息后，接收到服务端返回的消息再关闭客户端。UdpServer.javaimportio.netty.bootstrap.Bootstrap;importio.netty.channel.ChannelOption;importio.netty.channel.EventLoopGroup;importio.netty.ch
  • js 使用缓存判断在规定时间内显示一次弹框 洪洪呀 javascript缓存开发语言
    js使用缓存判断在规定时间内显示一次弹框功能拆分，新用户注册完成登录跳转首页，js根据注册时间判断显示一个新手指引的弹窗，只在注册当天登录且显示一次jQuery(document).ready(function($){getWinnerModalShow()});//新手指引functiongetWinnerModalShow(){varwinnerModal=newbootstrap.Modal
  • .NET 9.0 的 Blazor Web App 项目，Bootstrap Blazor 全局异常 ＜ErrorLogger＞ 使用备忘 cqths BootstrapBlazorBlazorWebAppbootstrap前端c#.net
    一、全局异常通过组件实现，可以对全局的日志、异常进行统一输出，该组件【已经包含】在中，使用了组件包裹的razor组件【不用】再额外添加组件包裹。二、全局异常默认已经开启、后台自动生效，【不用】在项目中做其他任务额外操作，项目发布后执行时，自动拦截异常，项目不会因为发生异常而崩溃、导致不可用，可能会在页面顶端显示全局异常的简要说明，如下图所示。三、如果要显示全局异常的详细说明，可以在appsetti
  • 教育定制开发中，如何通过代码实现多终端适配？ 万岳科技系统开发 外卖系统外卖系统开发小程序android开源
    随着移动设备、平板电脑和PC的普及，教育平台的用户往往使用多种终端访问系统。为了提供一致的用户体验，教育定制开发必须考虑多终端适配问题。本文将探讨在教育系统开发中，如何通过代码实现多终端适配，并提供一些核心技术和代码示例。一、多终端适配的关键技术响应式设计（ResponsiveDesign）使用CSS媒体查询，根据屏幕大小动态调整页面布局。前端框架支持借助前端框架如Bootstrap、Tailwi
  • Java实现的基于模板的网页结构化信息精准抽取组件：HtmlExtractor yangshangchuan 信息抽取HtmlExtractor精准抽取信息采集
    HtmlExtractor是一个Java实现的基于模板的网页结构化信息精准抽取组件，本身并不包含爬虫功能，但可被爬虫或其他程序调用以便更精准地对网页结构化信息进行抽取。   HtmlExtractor是为大规模分布式环境设计的，采用主从架构，主节点负责维护抽取规则，从节点向主节点请求抽取规则，当抽取规则发生变化，主节点主动通知从节点，从而能实现抽取规则变化之后的实时动态生效。 如
  • java编程思想 -- 多态 百合不是茶 java多态详解
    一: 向上转型和向下转型 面向对象中的转型只会发生在有继承关系的子类和父类中（接口的实现也包括在这里）。父类：人    子类：男人向上转型： Person p = new Man() ; //向上转型不需要强制类型转化向下转型： Man man =
  • [自动数据处理]稳扎稳打,逐步形成自有ADP系统体系 comsci dp
          对于国内的IT行业来讲,虽然我们已经有了"两弹一星",在局部领域形成了自己独有的技术特征,并初步摆脱了国外的控制...但是前面的路还很长....       首先是我们的自动数据处理系统还无法处理很多高级工程...中等规模的拓扑分析系统也没有完成,更加复杂的
  • storm 自定义 日志文件 商人shang stormclusterlogback
    Storm中的日志级级别默认为INFO，并且，日志文件是根据worker号来进行区分的，这样，同一个log文件中的信息不一定是一个业务的，这样就会有以下两个需求出现： 1. 想要进行一些调试信息的输出 2. 调试信息或者业务日志信息想要输出到一些固定的文件中   不要怕，不要烦恼，其实Storm已经提供了这样的支持，可以通过自定义logback 下的 cluster.xml 来输
  • Extjs3 SpringMVC使用 @RequestBody 标签问题记录 21jhf
    springMVC使用 @RequestBody(required = false) UserVO userInfo 传递json对象数据，往往会出现http 415，400,500等错误，总结一下需要使用ajax提交json数据才行，ajax提交使用proxy，参数为jsonData，不能为params；另外，需要设置Content-type属性为json，代码如下： （由于使用了父类aaa
  • 一些排错方法 文强chu 方法
    1、java.lang.IllegalStateException: Class invariant violation at org.apache.log4j.LogManager.getLoggerRepository(LogManager.java:199)at org.apache.log4j.LogManager.getLogger(LogManager.java:228) at o
  • Swing中文件恢复我觉得很难 小桔子 swing
           我那个草了！老大怎么回事，怎么做项目评估的？只会说相信你可以做的，试一下，有的是时间！        用java开发一个图文处理工具，类似word，任意位置插入、拖动、删除图片以及文本等。文本框、流程图等，数据保存数据库，其余可保存pdf格式。ok,姐姐千辛万苦，
  • php 文件操作 aichenglong PHP读取文件写入文件
    1 写入文件 @$fp=fopen("$DOCUMENT_ROOT/order.txt", "ab"); if(!$fp){ echo "open file error" ; exit; } $outputstring="date:"." \t tire:".$tire."
  • MySQL的btree索引和hash索引的区别 AILIKES 数据结构mysql算法
    Hash 索引结构的特殊性，其 检索效率非常高，索引的检索可以一次定位，不像B-Tree 索引需要从根节点到枝节点，最后才能访问到页节点这样多次的IO访问，所以 Hash 索引的查询效率要远高于 B-Tree 索引。     可能很多人又有疑问了，既然 Hash 索引的效率要比 B-Tree 高很多，为什么大家不都用 Hash 索引而还要使用 B-Tree 索引呢
  • JAVA的抽象--- 接口 --实现 百合不是茶
    抽象 接口 实现接口   //抽象 类 ,方法   //定义一个公共抽象的类 ,并在类中定义一个抽象的方法体 抽象的定义使用abstract   abstract class A 定义一个抽象类 例如： //定义一个基类 public abstract class A{     //抽象类不能用来实例化，只能用来继承 //
  • JS变量作用域实例 bijian1013 作用域
    <script> var scope='hello'; function a(){ console.log(scope); //undefined var scope='world'; console.log(scope); //world console.log(b);
  • TDD实践（二） bijian1013 javaTDD
    实践题目：分解质因数 Step1： 单元测试： package com.bijian.study.factor.test; import java.util.Arrays; import junit.framework.Assert; import org.junit.Before; import org.junit.Test; import com.bijian.
  • [MongoDB学习笔记一]MongoDB主从复制 bit1129 mongodb
    MongoDB称为分布式数据库，主要原因是1.基于副本集的数据备份， 2.基于切片的数据扩容。副本集解决数据的读写性能问题，切片解决了MongoDB的数据扩容问题。   事实上，MongoDB提供了主从复制和副本复制两种备份方式，在MongoDB的主从复制和副本复制集群环境中，只有一台作为主服务器，另外一台或者多台服务器作为从服务器。 本文介绍MongoDB的主从复制模式，需要指明
  • 【HBase五】Java API操作HBase bit1129 hbase
    import java.io.IOException; import org.apache.hadoop.conf.Configuration; import org.apache.hadoop.hbase.HBaseConfiguration; import org.apache.hadoop.hbase.HColumnDescriptor; import org.apache.ha
  • python调用zabbix api接口实时展示数据 ronin47
    zabbix api接口来进行展示。经过思考之后，计划获取如下内容：     1、  获得认证密钥     2、  获取zabbix所有的主机组     3、  获取单个组下的所有主机     4、  获取某个主机下的所有监控项  
  • jsp取得绝对路径 byalias 绝对路径
    在JavaWeb开发中，常使用绝对路径的方式来引入JavaScript和CSS文件，这样可以避免因为目录变动导致引入文件找不到的情况，常用的做法如下： 一、使用${pageContext.request.contextPath} 　　代码” ${pageContext.request.contextPath}”的作用是取出部署的应用程序名，这样不管如何部署，所用路径都是正确的。
  • Java定时任务调度：用ExecutorService取代Timer bylijinnan java
    《Java并发编程实战》一书提到的用ExecutorService取代Java Timer有几个理由，我认为其中最重要的理由是： 如果TimerTask抛出未检查的异常，Timer将会产生无法预料的行为。Timer线程并不捕获异常，所以 TimerTask抛出的未检查的异常会终止timer线程。这种情况下，Timer也不会再重新恢复线程的执行了;它错误的认为整个Timer都被取消了。此时，已经被
  • SQL 优化原则 chicony sql
    一、问题的提出 　在应用系统开发初期，由于开发数据库数据比较少，对于查询SQL语句，复杂视图的的编写等体会不出SQL语句各种写法的性能优劣，但是如果将应用系统提交实际应用后，随着数据库中数据的增加，系统的响应速度就成为目前系统需要解决的最主要的问题之一。系统优化中一个很重要的方面就是SQL语句的优化。对于海量数据，劣质SQL语句和优质SQL语句之间的速度差别可以达到上百倍，可见对于一个系统
  • java 线程弹球小游戏 CrazyMizzz java游戏
    最近java学到线程，于是做了一个线程弹球的小游戏，不过还没完善 这里是提纲 1.线程弹球游戏实现 1.实现界面需要使用哪些API类 JFrame JPanel JButton FlowLayout Graphics2D Thread Color ActionListener ActionEvent MouseListener Mouse
  • hadoop jps出现process information unavailable提示解决办法 daizj hadoopjps
    hadoop jps出现process information unavailable提示解决办法   jps时出现如下信息： 3019 -- process information unavailable3053 -- process information unavailable2985 -- process information unavailable2917 --
  • PHP图片水印缩放类实现 dcj3sjt126com PHP
    <?php class Image{ private $path; function __construct($path='./'){ $this->path=rtrim($path,'/').'/'; } //水印函数，参数：背景图，水印图，位置，前缀,TMD透明度 public function water($b,$l,$pos
  • IOS控件学习：UILabel常用属性与用法 dcj3sjt126com iosUILabel
    参考网站： http://shijue.me/show_text/521c396a8ddf876566000007 http://www.tuicool.com/articles/zquENb http://blog.csdn.net/a451493485/article/details/9454695 http://wiki.eoe.cn/page/iOS_pptl_artile_281
  • 完全手动建立maven骨架 eksliang javaeclipseWeb
    建一个 JAVA 项目 ： mvn archetype:create -DgroupId=com.demo -DartifactId=App [-Dversion=0.0.1-SNAPSHOT] [-Dpackaging=jar] 建一个 web 项目 ： mvn archetype:create -DgroupId=com.demo -DartifactId=web-a
  • 配置清单 gengzg 配置
    1、修改grub启动的内核版本 vi /boot/grub/grub.conf 将default 0改为1 拷贝mt7601Usta.ko到/lib文件夹 拷贝RT2870STA.dat到 /etc/Wireless/RT2870STA/文件夹 拷贝wifiscan到bin文件夹，chmod 775 /bin/wifiscan 拷贝wifiget.sh到bin文件夹，chm
  • Windows端口被占用处理方法 huqiji windows
    以下文章主要以80端口号为例，如果想知道其他的端口号也可以使用该方法..........................1、在windows下如何查看80端口占用情况?是被哪个进程占用?如何终止等.        这里主要是用到windows下的DOS工具,点击"开始"--"运行",输入&
  • 开源ckplayer 网页播放器， 跨平台(html5, mobile)，flv, f4v, mp4, rtmp协议. webm, ogg, m3u8 ！ 天梯梦 mobile
    CKplayer，其全称为超酷flv播放器，它是一款用于网页上播放视频的软件，支持的格式有：http协议上的flv,f4v,mp4格式，同时支持rtmp视频流格 式播放，此播放器的特点在于用户可以自己定义播放器的风格，诸如播放/暂停按钮，静音按钮，全屏按钮都是以外部图片接口形式调用，用户根据自己的需要制作 出播放器风格所需要使用的各个按钮图片然后替换掉原始风格里相应的图片就可以制作出自己的风格了，
  • 简单工厂设计模式 hm4123660 java工厂设计模式简单工厂模式
           简单工厂模式（Simple Factory Pattern）属于类的创新型模式，又叫静态工厂方法模式。是通过专门定义一个类来负责创建其他类的实例，被创建的实例通常都具有共同的父类。简单工厂模式是由一个工厂对象决定创建出哪一种产品类的实例。简单工厂模式是工厂模式家族中最简单实用的模式，可以理解为是不同工厂模式的一个特殊实现。
  • maven笔记 zhb8015 maven
    跳过测试阶段： mvn package -DskipTests 临时性跳过测试代码的编译： mvn package -Dmaven.test.skip=true   maven.test.skip同时控制maven-compiler-plugin和maven-surefire-plugin两个插件的行为，即跳过编译，又跳过测试。   指定测试类 mvn test
  • 非mapreduce生成Hfile，然后导入hbase当中 Stark_Summer maphbasereduceHfilepath实例
    最近一个群友的boss让研究hbase，让hbase的入库速度达到5w+/s，这可愁死了，4台个人电脑组成的集群，多线程入库调了好久，速度也才1w左右，都没有达到理想的那种速度，然后就想到了这种方式，但是网上多是用mapreduce来实现入库，而现在的需求是实时入库，不生成文件了，所以就只能自己用代码实现了，但是网上查了很多资料都没有查到，最后在一个网友的指引下，看了源码，最后找到了生成Hfile
  • jsp web tomcat 编码问题 王新春 tomcatjsppageEncode
    今天配置jsp项目在tomcat上，windows上正常，而linux上显示乱码，最后定位原因为tomcat 的server.xml 文件的配置，添加 URIEncoding 属性： <Connector port="8080" protocol="HTTP/1.1" connectionTi
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他