bangxionger9224
bangxionger9224

html5 +css3 点击后水波纹扩散效果 兼容移动端

DOCTYPE html>
<html>
<head>
  <meta http-equiv="Content-Type"
        content="text/html;charset=utf-8"/>
  <meta name="viewport"
        content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
  <title>html5+ js +css3 点击后水波纹扩散效果 兼容移动端-幸凡学习网title>
  <style> body {
    margin: 0;
    padding: 0;
  }

  .center {
    text-align: center
  }

  .btn {
    position: relative;
    width: 13em;
    height: 3em;
    margin: 2em;
    border: none;
    outline: none;
    letter-spacing: .2em;
    font-weight: bold;
    background: #999;
    cursor: pointer;
    overflow: hidden;
    user-select: none;
    border-radius: 2px;
    color: #fff;
  }

  button:nth-child(2) {
    background: #4285f4;
  }

  button:nth-child(3) {
    background: #00bad2;
  }

  button:nth-child(4) {
    background: #ff8a80;
  }

  button:nth-child(5) {
    background: #ffae00;
  }

  button:nth-child(6) {
    background: #aec156;
  }

  button:nth-child(7) {
    background: #a060a8;
  }

  button:nth-child(8) {
    background: #a78660;
  }

  button:nth-child(9) {
    background: #5da065;
  }

  button:nth-child(10) {
    background: #5e6b9a;
  }

  button:nth-child(11) {
    background: #9a5e5e;
  }

  button:nth-child(12) {
    background: #666;
  }

  .ripple {
    position: absolute;
    background: rgba(0, 0, 0, .15);
    border-radius: 100%;
    transform: scale(0);
    pointer-events: none;
  }

  .ripple.show {
    animation: ripple .75s ease-out;
  }

  @keyframes ripple {
    to {
      transform: scale(2);
      opacity: 0;
    }
  } style>
head>
<body><h1
  class="center">html5 +css3 点击后水波纹扩散效果 兼容移动端h1>
<div class="main
center">
  <button class="btn">BUTTONbutton>
  <button
    class="btn">BUTTON
  button>
  <button class="btn">BUTTONbutton>
  <button
    class="btn">BUTTON
  button>
  <button class="btn">BUTTONbutton>
  <button
    class="btn">BUTTON
  button>
  <button class="btn">BUTTONbutton>
  <button
    class="btn">BUTTON
  button>
  <button class="btn">BUTTONbutton>
  <button
    class="btn">BUTTON
  button>
  <button class="btn">BUTTONbutton>
  <button
    class="btn">BUTTON
  button>
div>
<script>
  var addRippleEffect =
    function (e) {
      var target = e.target;
      if (target.className.toLowerCase()
        !== 'btn') {
        return false;
      }
      var rect = target.getBoundingClientRect();
      var
        ripple = target.querySelector('.ripple');
      if (!ripple) {
        ripple =
          document.createElement('span');
        ripple.className = 'ripple'
        ripple.style.height = ripple.style.width = Math.max(rect.width,
          rect.height) + 'px'
        target.appendChild(ripple);
      }
      ripple.classList.remove('show');
      var top = e.pageY - rect.top -
        ripple.offsetHeight / 2 - document.body.scrollTop;
      var left = e.pageX -
        rect.left - ripple.offsetWidth / 2 - document.body.scrollLeft;
      ripple.style.top = top + 'px'
      ripple.style.left = left + 'px'
      ripple.classList.add('show');
      return false;
    }
  document.addEventListener('click', addRippleEffect, false); script>
body>
html>
View Code

 

转载于:https://www.cnblogs.com/theWayToAce/p/9997404.html

你可能感兴趣的:(html5 +css3 点击后水波纹扩散效果 兼容移动端)

  • Hugging Face 模型格式全解析：从 PyTorch 到 GGUF mingo_敏 DeepLearningpytorch人工智能python
    HuggingFace模型格式全解析：从PyTorch到GGUFHuggingFace生态支持多种模型格式，以满足不同场景下的存储、部署和推理需求。以下是主流格式的技术解析与演进脉络：1.PyTorch原生格式（.pt/.pth）特性：直接保存PyTorch的state_dict（模型参数）或完整模型（含结构）。兼容性强，与PyTorch训练/推理流程深度集成。文件体积较大，加载速度较慢，存在安全
  • 【C++】面向对象的三大特性：封装、继承、多态（3） _Yeps 【C++】基础知识解析c++算法
    1、面向对象的三大特性：封装、继承、多态——【C++】面向对象的三大特性：封装、继承、多态（1）详见以上链接，点击蓝字。2、C++的封装是如何实现的？——【C++】面向对象的三大特性：封装、继承、多态（2）详见以上链接，点击蓝字。3、C++的继承是如何实现的？在C++中，继承是通过:（冒号）+访问控制修饰符（public、protected、private）实现的。class父类{//父类的成员}
  • 深入解析 MySQL 数据库：隔离级别的选择 幽兰的天空 MYSQL数据库数据库mysqloracle
    在数据库中，创建事务一般包含几个简单的步骤。以下是如何在MySQL中创建事务的基本指南，包括相关的SQL语句和操作流程：1.启动事务在MySQL中，你可以使用STARTTRANSACTION或BEGIN语句来启动一个新的事务。这表示你将开始执行一系列操作，这些操作要么全部成功（提交），要么全部失败（回滚）。STARTTRANSACTION;--或者使用BEGIN;2.执行操作在事务被启动后，你可以
  • 【C语言】交换函数 Peter_chq c语言开发语言算法
    一、利用第三个变量交换1.错误的交换函数及原因voidswap1(intx,inty){intz=0;z=x;x=y;y=z;}inta=10;intb=20;printf("交换前：a=%d,b=%d\n",a,b);swap1(a,b);printf("swap1交换后：a=%d,b=%d\n",a,b);原因：传值调用函数，不可以改变实参的值。形参是实参的一份临时调用。调用swap1（a，b
  • H5语音识别功能(Web Speech API+科大讯飞) 辣辣1 语音识别前端
    H5语音识别效果图:方案一:WebSpeechAPI(免费,IE浏览器可用,谷歌浏览器不可用)方案一：WebSpeechAPI开始停止识别结果:{{finalTranscript}}{{interimTranscript}}import{ref,onMounted,onBeforeUnmount}from"vue";constisSupported=ref(false);constisRecord
  • 泛目录程序：2025快云站群程序的SEO优化功能 云惠科技 大数据泛目录
    快云站群程序的SEO优化功能围绕搜索引擎算法设计，具体包含以下核心模块：1.关键词智能布局密度检测与优化：自动分析内容关键词密度，建议合理区间（2%-8%），避免堆砌或遗漏；多词策略支持：可针对单篇内容设置主关键词+长尾词组合，覆盖更多搜索场景；标题/摘要自动生成：根据关键词智能生成高点击率的标题和Meta描述，提升搜索展示效果。2.内链自动化系统内容关联推荐：基于语义分析，自动在文章中插入相关内
  • 大小仅54K，可是效果很棒 海斗星河 python电脑智能手机
    大家在使用公众号编辑器时，都遇到过图片数量限制的问题。一旦达到50张或100张，编辑器就满了，只能手动删除。每次删这么多张图片，手都点麻了。为了提高效率，我之前一直用寒星鼠标连点器，它确实挺好用的。今天，我要给大家介绍一款更强大的鼠标连点器，功能比寒星更出色，有需要的小伙伴一定要及时收藏！软件介绍今天给大家介绍的这款软件叫**鼠标录制器**，它的体积非常小巧，只有54K，是一款绿色单文件版的鼠标连
  • 主流区块链平台对 EVM 的依赖情况分类说明 倒霉男孩 区块链知识区块链
    文章目录概要1.EVM兼容链BinanceSmartChain(BSC)Polygon(PoS链)AvalancheC-ChainFantomOptimism/Arbitrum2.非EVM链3.混合型链AvalanchePolygonSupernetsBNBChain概要1.EVM兼容链这些链直接支持以太坊虚拟机，开发者可用Solidity编写合约，并复用以太坊工具链：BinanceSmartCh
  • 【css酷炫效果】纯CSS实现球形阴影效果 冰夏之夜影 css前端
    【css酷炫效果】纯CSS实现球形阴影效果缘创作背景html结构css样式完整代码基础版进阶版(动态版)效果图想直接拿走的老板，链接放在这里：上传后更新缘创作随缘，不定时更新。创作背景刚看到csdn出活动了，赶时间，直接上代码，令人丧气的是：活动的领域有要求，不是发够就行，瞬间意志消沉。html结构css样式.button{background-image:url('a.gif');border-
  • 一文搞懂Nginx: 域名配置、SSL、HTTP转HTTPS 千层冷面 知识类httpnginxssllinux
    本文将在Centos系统下详解Nginx服务器，从概念、下载、安装、编译、配置(含域名和证书)到启动。本文先讲Nginx如何使用，然后再谈概念。一、实践1.下载下载通常有2种方式：Centos自带的包管理工具、源码编译安装(推荐，拓展性强)，本文使用源码编译安装的形式下载从Nginx官网（nginx.org）下载Nginx的源代码。亦可以使用wget命令或者浏览器下载后通过FTP等方式传输到服务器
  • 【LeetCode 热题100】 23. 合并 K 个升序链表的算法思路及python代码 pljnb LeetCode热题100算法leetcode链表
    23.合并K个升序链表给你一个链表数组，每个链表都已经按升序排列。请你将所有链表合并到一个升序链表中，返回合并后的链表。示例1：输入：lists=[[1,4,5],[1,3,4],[2,6]]输出：[1,1,2,3,4,4,5,6]解释：链表数组如下：[1->4->5,1->3->4,2->6]将它们合并到一个有序链表中得到。1->1->2->3->4->4->5->6示例2：输入：lists=[
  • 【Leetcode刷题随笔】844 比较含退格的字符串 Poor_DayDreamer 移除元素篇字符串篇leetcode算法职场和发展
    1.题目描述给定s和t两个字符串，比较s和t是否在删除所有由#字符表示的退格操作后相等。退格操作会删除其前面（不包括#本身）的一个字符，如果前面没有字符则忽略该#。如果字符串的末尾有多个退格符，它们会相互抵消，直到没有退格符剩余或者所有字符都被删除。示例1：输入：s=“ab#c”,t=“ad#c”输出：true解释：s和t都会变成“ac”，因为#前面的b和d都被删除。示例2：输入：s=“ab##”
  • 关于HAL库STM32中断接收丢失第一个字节的问题 隔夜秀才 STM32stm32
    被HAL库中断接收丢失首字节的这个问题折磨了四天了，今天终于解决了，觉得有必要记录一下。问题是这样的：刚开始上电后，用串口助手给串口1发送一帧数据（有帧头帧尾的），正常接收，继续发送，也正常接收，之后当串口4中断接收数据完成后，再用串口助手给串口1发送一帧数据的时候，发现首字节会丢失无法接收到，如果不让串口4进中断接收，就不会这样。网上搜罗查阅了很多资料，什么RXNE、ORE、TC问题都试过了，一
  • table点击行事件，且点击行高亮 爱吃玉米的兔子 vue.jsjavascriptelementui
    consttableData=[{id:1,date:"2025-03-20",name:"Tom",},{id:2,date:"2025-03-21",name:"Hom",},{id:3,date:"2025-03-22",name:"Rem",},];constselectedRow=ref(null);//储存选中的行//点击行操作事件constrowChange=(row)=>{sele
  • STM32HAL库，解决串口UART中断接收到的第一个字节数据丢失 IT.小航 STM32-—hal库stm32单片机嵌入式硬件
    1.问题描述：只有上电后第一次接收到的第一字节数据会丢失，往后再接收也不会存在问题了。2.先贴出来重写UART中断回调函数我在接收到第一字节数据后开启定时器中断的，做一个超时处理，每次接收到数据会对定时器计数值清零，如果超过6ms则认为一帧数据接收完毕。voidHAL_UART_RxCpltCallback(UART_HandleTypeDef*huart){if(huart->Instance=
  • Parrot OS 6.3 发布！全面提升安全性，新增先进工具，带来更高性能 wljslmz Linux技术linuxParrotOS
    2025年2月，全球知名的安全和隐私为核心的Linux发行版——ParrotOS迎来了其最新版本——ParrotOS6.3。作为一款基于Debian的多功能操作系统，ParrotOS旨在为安全专家、开发人员以及关注隐私的用户提供强大的功能支持。ParrotOS6.3版本在性能、工具更新、硬件支持等方面进行了一系列优化，凭借其更加稳定的安全性，最新的工具包，以及对硬件兼容性的大幅提升，ParrotO
  • 一文读懂std::move() SJTU 路子 c++
    左值和右值左值和右值的根本区别在于是否允许取地址&运算符获得对应的内存地址变量可以取地址，所以左值；但是常量和临时对象等不可以取地址，所以是右值左值是表达式结束后依然存在的持久对象(代表一个在内存中占有确定位置的对象)右值是表达式结束时不在存在的临时对象(不在内存中占有确定位置的表达式)左值引用和右值引用左值引用的声明符号为&，右值引用的声明符号为&&右值引用是用来支持转移语义的右值引用，用以引用
  • Web自动化测试（一） 树的鲨鱼 前端自动化功能测试
    提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档Web自动化测试（一）前言一、自动化相关理论1.什么是自动化以及它的好处2.什么是软件测试3.什么是自动化测试4.自动化测试能解决什么问题4.自动化测试分类5.什么Web项目适合做自动化测试6.Web自动化测试所属分类7.主流的Web自动化测试化工具二、Selenium1.特点2.发展历程3.环境搭建4.第一个案例三、Selenium
  • 如何用Python和Selenium实现表单的自动填充与提交？ 字节王德发 pythonpythonselenium开发语言
    在今天的数字化时代，自动化工具可以极大地提高工作效率。很多人可能会觉得填表单是个繁琐的任务，不过你知道吗？用Python和Selenium可以轻松解决这一问题！本文将带你走进如何利用这两个强大的工具，实现表单的自动填充和提交，让你省去不少时间。什么是Selenium？Selenium是一个广泛使用的自动化测试工具，它能够模拟用户在浏览器中的操作。通过它，我们可以自动化执行诸如点击按钮、输入文本、选
  • std::forward与std::move详解 _DCG_ c++算法
    在阅读代码时遇到了std::forward与std::move，对这两个方法含义及使用场景有点不太清楚，在此写文章进行记录加深印象。std::forward概念保持传递值的类别不变，顾名思义，即传入一个左值，那么经过forward传递后还是一个左值；传入一个右值，经过forward转换后还是一个右值。它保持了原始实参的值类别，而不是强制进行转换，如果原始实参是左值，它就会转发为左值；如果原始实参为
  • 如何在 Python 中将语音转换为文本 无水先生 语音处理人工智能综合pythonxcode开发语言
    一、说明  学习如何使用语音识别Python库执行语音识别，以在Python中将音频语音转换为文本。想要更快地编码吗？我们的Python代码生成器让您只需点击几下即可创建Python脚本。现在就现在试试！二、语言AI库2.1相当给力的转文字库  语音识别是计算机软件识别口语中的单词和短语并将其转换为人类可读文本的能力。在本教程中，您将学习如何使用SpeechRecognition库在Python中
  • 精准测试：软件开发中的高效质量保障利器 霍格沃兹软件测试开发 精准化测试测试用例安全性测试测试覆盖率模块测试selenium测试工具压力测试
    全面解析软件测试开发：人工智能测试、自动化测试、性能测试、测试左移、测试右移到DevOps如何驱动持续交付在现代软件开发中，测试效率与测试质量直接影响产品竞争力。精准测试作为一项兼具效率与精度的创新测试方法，已经成为众多企业提升软件质量的重要手段。本篇文章围绕精准测试的落地实施、对质量指标的提升、数据统计与效果评估方法以及如何提高投入产出比进行全面解读，帮助企业掌握精准测试的价值与实践路径。精准测
  • MFi认证和Find My认证的区别在哪里？ Microtes 苹果认证
    MFi认证与FindMy认证的区别在科技数码领域，认证是确保产品质量和兼容性的重要环节。对于苹果用户来说，MFi认证和FindMy认证是两个常见的名词。本文将探讨这两者之间的区别。MFi认证，即“MadeforiPhone/iPod/iPad”的缩写，是苹果公司对其授权配件厂商生产的外置配件的一种标识使用许可。这些配件，如数据线、充电器等，经过苹果官方的授权和认证，以满足苹果产品的性能标准。这种认
  • CSS3背景与渐变 天涯学馆 大前端&移动端全栈架构css3前端css
    背景与渐变background-sizebackground-size属性用于设置背景图像的尺寸。您可以指定绝对或相对单位，或者使用关键词来控制背景图像在元素背景区域中的大小。.element{background-size:[length|percentage|cover|contain]|[length|percentage][length|percentage]|auto|inherit;}
  • HTML：ul标签的作用 凭君语未可 Web开发html前端
    ul标签解释解释举例效果分析``标签支持的属性1.`type`举例：效果：分析2.`class`举例：效果：分析解释在HTML中，标签表示无序列表（UnorderedList）。它用于创建一个项目列表，其中列表项通常以圆形、方形或none的图标（也称为列表项标记）进行标记。每个列表项都是使用（listitem）标签创建的。举例123效果分析在上面的例子中，我们创建了一个包含三个项目的无序列表，这些
  • Demo发布 | ClkLog成功集成Unity3D
    前言在Clklog完成ReactNative和uni-app集成Demo后，一个游戏行业新客户提出了使用Unity3D开发的集成问题。对此，我们与客户分别进行了测试。客户使用神策Andriod原生SDK在Android端暴露接口给Unity3D的方式，验证了使用ClkLog进行数据采集的可行性。同时，ClkLog联合合作伙伴对神策Unity3DSDK（安卓端、IOS端、MacOS）进行了深入测试，
  • Ubuntu Qt: no service found for - “org.qt-project.qt.mediaplayer“ wkm956 qt开发语言ubuntu
    1、前言在一次项目过程中，因项目需求，需要将windows开发的Qt项目迁移到ubuntu系统中，且在某个功能项中需要播放音频，在windows系统中能够正常运行，但在ubuntu系统中却显示defaultServiceProvider::requestService():noservicefoundfor-"org.qt-project.qt.mediaplayer"错误，在网上查找资料后解决问
  • python安装scipy库出错_解决scipy安装（pip install scipy）失败,以及其他问题 weixin_39663933
    解决scipy安装(pipinstallscipy)失败,以及其他问题解决：1.在scipy官方库中并没有适合Windows的python3.6相关版本，故需要在网址http://www.lfd.uci.edu/~gohlke/pythonlibs/#scipy下载适合的版本，下载如：scipy‑0.19.1‑cp36‑cp36m‑win32.whl2.Windows中scipy安装成功后，还会存
  • 动态规划算法优化在资源分配问题中的应用 suyang199312 课程设计
    摘要资源分配问题广泛存在于各类生产与管理场景，合理分配资源以实现效益最大化至关重要。本文深入剖析动态规划算法在资源分配问题中的应用，详细阐述其基本原理与常规解法，针对常规解法的不足提出创新优化思路，并给出具体实现步骤。通过实际案例分析与实验验证，展示优化后的动态规划算法在提升资源分配效率和效益方面的显著优势，为相关领域的决策制定提供有力支持。引言在经济、工程、计算机科学等众多领域，资源分配问题无处
  • RabbitMQ 集群降配 Hover_Z_快跑 rabbitmq分布式
    这里写自定义目录标题摘要检查状态1.检查RabbitMQ服务状态2.检查RabbitMQ端口监听3.检查RabbitMQ管理插件是否启用4.检查开机自启状态5.确认集群高可用性6.检查使用该集群的服务是否做了断开重连实操1.负载均衡配置2.逐个节点降配（滚动操作）2.1停止RabbitMQ服务2.2调整ECS配置2.3恢复节点并重新加入集群2.4恢复负载均衡流量3.全局监控与验证4.降配后优化（可
  • Js函数返回值 _wy_ jsreturn
    一、返回控制与函数结果，语法为：return 表达式;作用: 结束函数执行，返回调用函数，而且把表达式的值作为函数的结果 二、返回控制语法为：return;作用: 结束函数执行，返回调用函数，而且把undefined作为函数的结果 在大多数情况下,为事件处理函数返回false,可以防止默认的事件行为.例如,默认情况下点击一个<a>元素,页面会跳转到该元素href属性
  • MySQL 的 char 与 varchar bylijinnan mysql
    今天发现，create table 时，MySQL 4.1有时会把 char 自动转换成 varchar 测试举例： CREATE TABLE `varcharLessThan4` ( `lastName` varchar(3) ) ; mysql> desc varcharLessThan4; +----------+---------+------+-
  • Quartz——TriggerListener和JobListener eksliang TriggerListenerJobListenerquartz
    转载请出自出处：http://eksliang.iteye.com/blog/2208624 一.概述 listener是一个监听器对象，用于监听scheduler中发生的事件，然后执行相应的操作；你可能已经猜到了，TriggerListeners接受与trigger相关的事件，JobListeners接受与jobs相关的事件。   二.JobListener监听器  j
  • oracle层次查询 18289753290 oracle；层次查询；树查询
    .oracle层次查询(connect  by) oracle的emp表中包含了一列mgr指出谁是雇员的经理，由于经理也是雇员，所以经理的信息也存储在emp表中。这样emp表就是一个自引用表，表中的mgr列是一个自引用列，它指向emp表中的empno列，mgr表示一个员工的管理者， select   empno,mgr,ename,sal  from e
  • 通过反射把map中的属性赋值到实体类bean对象中 酷的飞上天空 javaee泛型类型转换
    使用过struts2后感觉最方便的就是这个框架能自动把表单的参数赋值到action里面的对象中 但现在主要使用Spring框架的MVC，虽然也有@ModelAttribute可以使用但是明显感觉不方便。 好吧，那就自己再造一个轮子吧。 原理都知道，就是利用反射进行字段的赋值，下面贴代码 主要类如下：   import java.lang.reflect.Field; imp
  • SAP HANA数据存储：传统硬盘的瓶颈问题 蓝儿唯美 HANA
    SAPHANA平台有各种各样的应用场景，这也意味着客户的实施方法有许多种选择，关键是如何挑选最适合他们需求的实施方案。 在 《Implementing SAP HANA》这本书中，介绍了SAP平台在现实场景中的运作原理，并给出了实施建议和成功案例供参考。本系列文章节选自《Implementing SAP HANA》，介绍了行存储和列存储的各自特点，以及SAP HANA的数据存储方式如何提升空间压
  • Java Socket 多线程实现文件传输 随便小屋 javasocket
            高级操作系统作业，让用Socket实现文件传输，有些代码也是在网上找的，写的不好，如果大家能用就用上。 客户端类：   package edu.logic.client; import java.io.BufferedInputStream; import java.io.Buffered
  • java初学者路径 aijuans java
    学习Java有没有什么捷径?要想学好Java，首先要知道Java的大致分类。自从Sun推出Java以来，就力图使之无所不包，所以Java发展到现在，按应用来分主要分为三大块：J2SE,J2ME和J2EE,这也就是Sun ONE(Open Net Environment)体系。J2SE就是Java2的标准版，主要用于桌面应用软件的编程；J2ME主要应用于嵌入是系统开发，如手机和PDA的编程；J2EE
  • APP推广 aoyouzi APP推广
    一，免费篇 1，APP推荐类网站自主推荐 最美应用、酷安网、DEMO8、木蚂蚁发现频道等,如果产品独特新颖，还能获取最美应用的评测推荐。PS：推荐简单。只要产品有趣好玩，用户会自主分享传播。例如足迹APP在最美应用推荐一次，几天用户暴增将服务器击垮。 2，各大应用商店首发合作 老实盯着排期，多给应用市场官方负责人献殷勤。 3，论坛贴吧推广 百度知道，百度贴吧，猫扑论坛，天涯社区，豆瓣（
  • JSP转发与重定向 百合不是茶 jspservletJava Webjsp转发
      在servlet和jsp中我们经常需要请求,这时就需要用到转发和重定向;   转发包括;forward和include     例子;forwrad转发;  将请求装法给reg.html页面   关键代码;    req.getRequestDispatcher("reg.html
  • web.xml之jsp-config bijian1013 javaweb.xmlservletjsp-config
    1.作用：主要用于设定JSP页面的相关配置。 2.常见定义： <jsp-config> <taglib> <taglib-uri>URI(定义TLD文件的URI,JSP页面的tablib命令可以经由此URI获取到TLD文件)</tablib-uri> <taglib-location> TLD文件所在的位置
  • JSF2.2 ViewScoped Using CDI sunjing CDIJSF 2.2ViewScoped
    JSF 2.0 introduced annotation @ViewScoped; A bean annotated with this scope maintained its state as long as the user stays on the same view(reloads or navigation - no intervening views). One problem w
  • 【分布式数据一致性二】Zookeeper数据读写一致性 bit1129 zookeeper
    很多文档说Zookeeper是强一致性保证，事实不然。关于一致性模型请参考http://bit1129.iteye.com/blog/2155336    Zookeeper的数据同步协议 Zookeeper采用称为Quorum Based Protocol的数据同步协议。假如Zookeeper集群有N台Zookeeper服务器(N通常取奇数，3台能够满足数据可靠性同时
  • Java开发笔记 白糖_ java开发
    1、Map<key,value>的remove方法只能识别相同类型的key值   Map<Integer,String> map = new HashMap<Integer,String>(); map.put(1,"a"); map.put(2,"b"); map.put(3,"c"
  • 图片黑色阴影 bozch 图片
     .event{ padding:0;    width:460px;    min-width: 460px;    border:0px solid #e4e4e4;    height: 350px;    min-heig
  • 编程之美-饮料供货-动态规划 bylijinnan 动态规划
    import java.util.Arrays; import java.util.Random; public class BeverageSupply { /** * 编程之美 饮料供货 * 设Opt（V’，i）表示从i到n-1种饮料中，总容量为V’的方案中，满意度之和的最大值。 * 那么递归式就应该是：Opt（V’，i）=max{ k * Hi+Op
  • ajax大参数（大数据）提交性能分析 chenbowen00 WebAjax框架浏览器prototype
    近期在项目中发现如下一个问题 项目中有个提交现场事件的功能，该功能主要是在web客户端保存现场数据（主要有截屏，终端日志等信息）然后提交到服务器上方便我们分析定位问题。客户在使用该功能的过程中反应点击提交后反应很慢，大概要等10到20秒的时间浏览器才能操作，期间页面不响应事件。 根据客户描述分析了下的代码流程，很简单，主要通过OCX控件截屏，在将前端的日志等文件使用OCX控件打包，在将之转换为
  • [宇宙与天文]在太空采矿,在太空建造 comsci
         我们在太空进行工业活动...但是不太可能把太空工业产品又运回到地面上进行加工,而一般是在哪里开采,就在哪里加工,太空的微重力环境,可能会使我们的工业产品的制造尺度非常巨大....      地球上制造的最大工业机器是超级油轮和航空母舰,再大些就会遇到困难了,但是在空间船坞中,制造的最大工业机器,可能就没
  • ORACLE中CONSTRAINT的四对属性 daizj oracleCONSTRAINT
    ORACLE中CONSTRAINT的四对属性 summary:在data migrate时,某些表的约束总是困扰着我们,让我们的migratet举步维艰,如何利用约束本身的属性来处理这些问题呢?本文详细介绍了约束的四对属性: Deferrable/not deferrable, Deferred/immediate, enalbe/disable, validate/novalidate,以及如
  • Gradle入门教程 dengkane gradle
    一、寻找gradle的历程 一开始的时候，我们只有一个工程，所有要用到的jar包都放到工程目录下面，时间长了，工程越来越大，使用到的jar包也越来越多，难以理解jar之间的依赖关系。再后来我们把旧的工程拆分到不同的工程里，靠ide来管理工程之间的依赖关系，各工程下的jar包依赖是杂乱的。一段时间后，我们发现用ide来管理项程很不方便，比如不方便脱离ide自动构建，于是我们写自己的ant脚本。再后
  • C语言简单循环示例 dcj3sjt126com c
    # include <stdio.h> int main(void) { int i; int count = 0; int sum = 0; float avg; for (i=1; i<=100; i++) { if (i%2==0) { count++; sum += i; } } avg
  • presentModalViewController 的动画效果 dcj3sjt126com controller
    系统自带(四种效果)： presentModalViewController模态的动画效果设置：     [cpp]  view plain copy   UIViewController *detailViewController = [[UIViewController al
  • java 二分查找 shuizhaosi888 二分查找java二分查找
    需求：在排好顺序的一串数字中，找到数字T   一般解法：从左到右扫描数据，其运行花费线性时间O(N)。然而这个算法并没有用到该表已经排序的事实。 /** * * @param array * 顺序数组 * @param t * 要查找对象 * @return */ public stati
  • Spring Security（07）——缓存UserDetails 234390216 ehcache缓存Spring Security
           Spring Security提供了一个实现了可以缓存UserDetails的UserDetailsService实现类，CachingUserDetailsService。该类的构造接收一个用于真正加载UserDetails的UserDetailsService实现类。当需要加载UserDetails时，其首先会从缓存中获取，如果缓存中没
  • Dozer 深层次复制 jayluns VOmavenpo
    最近在做项目上遇到了一些小问题，因为架构在做设计的时候web前段展示用到了vo层，而在后台进行与数据库层操作的时候用到的是Po层。这样在业务层返回vo到控制层，每一次都需要从po-->转化到vo层，用到BeanUtils.copyProperties(source, target)只能复制简单的属性，因为实体类都配置了hibernate那些关联关系，所以它满足不了现在的需求，但后发现还有个很
  • CSS规范整理（摘自懒人图库） a409435341 htmlUIcss浏览器
       刚没事闲着在网上瞎逛，找了一篇CSS规范整理，粗略看了一下后还蛮有一定的道理，并自问是否有这样的规范，这也是初入前端开发的人一个很好的规范吧。 一、文件规范 1、文件均归档至约定的目录中。 具体要求通过豆瓣的CSS规范进行讲解： 所有的CSS分为两大类：通用类和业务类。通用的CSS文件，放在如下目录中： 基本样式库 /css/core
  • C++动态链接库创建与使用 你不认识的休道人 C++dll
    一、创建动态链接库 1.新建工程test中选择”MFC [dll]”dll类型选择第二项"Regular DLL With MFC shared linked"，完成 2.在test.h中添加 extern “C” 返回类型 _declspec(dllexport)函数名(参数列表); 3.在test.cpp中最后写 extern “C” 返回类型 _decls
  • Android代码混淆之ProGuard rensanning ProGuard
    Android应用的Java代码，通过反编译apk文件（dex2jar、apktool）很容易得到源代码，所以在release版本的apk中一定要混淆一下一些关键的Java源码。 ProGuard是一个开源的Java代码混淆器（obfuscation）。ADT r8开始它被默认集成到了Android SDK中。 官网： http://proguard.sourceforge.net/
  • 程序员在编程中遇到的奇葩弱智问题 tomcat_oracle jquery编程ide
    　　现在收集一下：       　　排名不分先后，按照发言顺序来的。   1、Jquery插件一个通用函数一直报错，尤其是很明显是存在的函数，很有可能就是你没有引入jquery。。。或者版本不对 2、调试半天没变化：不在同一个文件中调试。这个很可怕，我们很多时候会备份好几个项目，改完发现改错了。有个群友说的好：   在汤匙
  • 解决maven-dependency-plugin (goals "copy-dependencies","unpack") is not supported xp9802 dependency
    解决办法：在plugins之前添加如下pluginManagement，二者前后顺序如下：   [html]  view plain copy   <build>           <pluginManagement
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他