kaosini
kaosini

Css3 3d animation Step1---介绍如何实现css动画

转载地址:http://www.iteye.com/topic/1116417


前言：

好久没写文章了，今天看到webQQ又一次升级。我用的chrome的画面切换甚至用到了css 3d animation+3dtransform。

 

这是本系列的第一篇文章，用于介绍仅用css实现3d动画。也许这篇文章也许过于超前，因为大部分的浏览器器，甚至包括FF，都还没有实现3d transform。涉及到animation的部分，你可以通过webkit内核的浏览器(Chrome or Safari)或者Firefox来浏览，但是涉及到3d transform的东西请用webkit的浏览器器浏览。

 

Css3 @KeyFrames Rule

什么是KeyFrames？直译过来就是关键帧。你可以把他理解为flash中的关键帧。他以关键字from开始，to结束。中间的部分都为百分比。意为动画到了某个百分比时，他的状态。而帧与帧之间的补间动画浏览器会帮你自动生成。

 

例如：

Html代码   收藏代码
  1. <style type="text/css">    
  2.         
  3.     @keyframes myfirst {    
  4.         from {background: red;}    
  5.         to {background: yellow;}    
  6.     }    
  7.     
  8.     @-moz-keyframes myfirst /* Firefox */ {    
  9.         from {background: red;}    
  10.         to {background: yellow;}    
  11.     }    
  12.     
  13.     @-webkit-keyframes myfirst /* Safari and Chrome */ {    
  14.         from {background: red;}    
  15.         to {background: yellow;}    
  16.     }    
  17.         
  18. </style>    
  为了支持将来可能有的标准，你不得不写3遍。

试着运行下面的代码，里面可能会有你没见过的属性，我们下面会讲到

 

 大家等待了两秒后，突然从画面左上角出现一个方块，花费5秒从红色变到黄色。可能大家已经猜到了

Html代码   收藏代码
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">    
  2. <html>    
  3. <head>    
  4. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">    
  5. <title>Insert title here</title>    
  6.     
  7.     
  8. <style type="text/css">    
  9.         
  10.     @keyframes myfirst {    
  11.         from {background: red;}    
  12.         to {background: yellow;}    
  13.     }    
  14.     
  15.     @-moz-keyframes myfirst /* Firefox */ {    
  16.         from {background: red;}    
  17.         to {background: yellow;}    
  18.     }    
  19.     
  20.     @-webkit-keyframes myfirst /* Safari and Chrome */ {    
  21.         from {background: red;}    
  22.         to {background: yellow;}    
  23.     }    
  24.         
  25.     #sample {    
  26.         animation-name: myfirst;    
  27.         animation-duration: 5s;    
  28.         animation-timing-function: linear;    
  29.         animation-delay: 2s;    
  30.         animation-iteration-count: infinite;    
  31.         animation-direction: alternate;    
  32.         animation-play-state: running;    
  33.         /* Firefox: */    
  34.         -moz-animation-name: myfirst;    
  35.         -moz-animation-duration: 5s;    
  36.         -moz-animation-timing-function: linear;    
  37.         -moz-animation-delay: 2s;    
  38.         -moz-animation-iteration-count: infinite;    
  39.         -moz-animation-direction: alternate;    
  40.         -moz-animation-play-state: running;    
  41.         /* Safari and Chrome: */    
  42.         -webkit-animation-name: myfirst;    
  43.         -webkit-animation-duration: 5s;    
  44.         -webkit-animation-timing-function: linear;    
  45.         -webkit-animation-delay: 2s;    
  46.         -webkit-animation-iteration-count: infinite;    
  47.         -webkit-animation-direction: alternate;    
  48.         -webkit-animation-play-state: running;    
  49.     }    
  50.         
  51. </style>    
  52.     
  53. </head>    
  54. <body>    
  55.     <div id="sample" style="width:120px; height:120px;">    
  56.             
  57.     </div>    
  58. </body>    
  59. </html>    
 

 

animation-name： 和上面的@keyframe的名字对应起来，代表当前用的是何种变换

animation-duration: 代表动画开始到结束总共耗时多少时间

animation-timing-function： 代表动画的进行是均匀的还是先快后慢还是？他有这几个枚举值：linear:线性，ease:默认值，先慢后快，到了快一半的时候再变慢，ease-in:先慢后快,ease-out:先快后慢。ease-in-out:两头慢，中间快。cubic-bezier(n,n,n,n)：自定义，n只能输入0-1之间的值。输入的值越大，移动的越慢，4个n代表了动画的4个阶段25%，50%，75%，100%。

 

也就是说，linear,ease等值，只是cubic-bezier在浏览器中的预设值，可以简单表示如下：

 

animation-delay：代表动画延迟多少时间开始，默认为0

Html代码   收藏代码
  1. #linear {animation-timing-function: cubic-bezier(0,0,1,1;}    
  2. #ease {animation-timing-function: cubic-bezier(0.25,0.1,0.25,1);}    
  3. #ease-in {animation-timing-function: cubic-bezier(0.42,0,1,1);}    
  4. #ease-out {animation-timing-function: cubic-bezier(0,0,0.58,1);}    
  5. #ease-in-out {animation-timing-function: cubic-bezier(0.42,0,0.58,1);}   
 

animation-iteration-count:代表动画执行多少次，默认为1.如果输入infinite，则代表无限次

animation-direction：默认值为normal，代表动画执行完后从头开始。如果设置为alternate，那么动画在结束后，第二遍会反着执行一遍

animation-play-state：默认值running，代表现在是执行状态。如果要让动画停止，只需要把这个值赋值为paused

 

 

好，接下来把上面的代码串联起来。

Html代码   收藏代码
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">    
  2. <html>    
  3. <head>    
  4. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">    
  5. <title>Insert title here</title>    
  6.     
  7.     
  8. <style type="text/css">    
  9.         
  10.     @keyframes myfirst {    
  11.         from {left:0px; top:0px; background: red; }    
  12.         50% {left:100px; top:80px;}    
  13.         70%, 80% {transform: rotate(-360deg);left:240px; top:240px;}    
  14.         to {left:279px; top:279px; background: yellow;}    
  15.     }    
  16.     
  17.     @-moz-keyframes myfirst /* Firefox */ {    
  18.         from {left:0px; top:0px; background: red; }    
  19.         50% {left:100px; top:80px;}    
  20.         70%, 80% {-moz-transform: rotate(-360deg);left:240px; top:240px;}    
  21.         to {left:279px; top:279px; background: yellow;}    
  22.     }    
  23.     
  24.     @-webkit-keyframes myfirst /* Safari and Chrome */ {    
  25.         from {left:0px; top:0px; background: red; }    
  26.         50% {left:100px; top:80px;}    
  27.         70%, 80% {-webkit-transform: rotate(-360deg) scale(0.5, 0.5);left:240px; top:240px;}    
  28.         to {left:279px; top:279px; background: yellow;}    
  29.     }    
  30.         
  31.     #sample {    
  32.         animation-name: myfirst;    
  33.         animation-duration: 5s;    
  34.         animation-timing-function: linear;    
  35.         animation-iteration-count: infinite;    
  36.         animation-direction: alternate;    
  37.         /* Firefox: */    
  38.         -moz-animation-name: myfirst;    
  39.         -moz-animation-duration: 5s;    
  40.         -moz-animation-timing-function: linear;    
  41.         -moz-animation-iteration-count: infinite;    
  42.         -moz-animation-direction: alternate;    
  43.         /* Safari and Chrome: */    
  44.         -webkit-animation-name: myfirst;    
  45.         -webkit-animation-duration: 5s;    
  46.         -webkit-animation-timing-function: linear;    
  47.         -webkit-animation-iteration-count: infinite;    
  48.         -webkit-animation-direction: alternate;    
  49.     }    
  50.         
  51. </style>    
  52.     
  53. </head>    
  54. <body>    
  55.     <div style="width:400px; height:400px; border-style:dashed; border-width:1px; position:relative;">    
  56.         <div id="sample" style="width:120px; height:120px; position:absolute;"></div>    
  57.     </div>    
  58.         
  59. </body>    
  60. </html>    

你可能感兴趣的:(Css3 3d animation Step1---介绍如何实现css动画)

  • 作为普通程序员，我们该如何学习大模型（LLM），学习路线和知识体系 和老莫一起学AI 学习人工智能深度学习语言模型ai程序员转行
    前言原谅我的后知后觉，才开始从头写，我是已经上了一阶段大模型的课，也搜集了些资料，并自己做了小部分实践，回过头来，才想开始整理些文章。起初，大家都在写，都在发，我那会在焦虑。自chatgpt爆火以来，AI技术又被广泛关注，国内外各大厂商也纷纷布局，作为我们每一个普通人，也无不时刻感受着AI一波又一波的冲击。尤其是作为程序员的我，相信绝大多数程序员也有和我一样的感受，从一开始的新奇，到焦虑，到试图去
  • 零基础入门AI：一键本地运行各种开源大语言模型 - Ollama 和老莫一起学AI 人工智能开源语言模型机器学习prompt深度学习学习
    什么是Ollama？Ollama是一个可以在本地部署和管理开源大语言模型的框架，由于它极大的简化了开源大语言模型的安装和配置细节，一经推出就广受好评，目前已在github上获得了46kstar。不管是著名的羊驼系列，还是最新的AI新贵Mistral，等等各种开源大语言模型，都可以用Ollama实现一键安装并运行，支持的更多模型的列表可以查看Ollama官网。ModelParametersSizeD
  • Web安全攻防入门教程——hvv行动详解 白帽子黑客罗哥 web安全安全hw护网行动网络安全
    Web安全攻防入门教程Web安全攻防是指在Web应用程序的开发、部署和运行过程中，保护Web应用免受攻击和恶意行为的技术与策略。这个领域不仅涉及防御措施的实现，还包括通过渗透测试、漏洞挖掘和模拟攻击来识别潜在的安全问题。本教程将带你入门Web安全攻防的基础概念、常见攻击类型、防御技术以及一些实战方法。一、Web安全基础Web应用安全的三大核心目标（CIA三原则）机密性(Confidentialit
  • 网络安全最新HVV（护网）蓝队视角的技战法分析_护网技战法报告(1)，2024年最新网络安全开发基础作用 2401_84520093 程序员网络安全学习面试
    如何自学黑客&网络安全黑客零基础入门学习路线&规划初级黑客1、网络安全理论知识（2天）①了解行业相关背景，前景，确定发展方向。②学习网络安全相关法律法规。③网络安全运营的概念。④等保简介、等保规定、流程和规范。（非常重要）2、渗透测试基础（一周）①渗透测试的流程、分类、标准②信息收集技术：主动/被动信息搜集、Nmap工具、GoogleHacking③漏洞扫描、漏洞利用、原理，利用方法、工具（MSF
  • 时间语义与窗口操作：Flink 流式计算的核心逻辑 小诸葛IT课堂 flink大数据
    在实时数据流处理中，时间是最为关键的维度之一。Flink通过灵活的时间语义和丰富的窗口类型，为开发者提供了强大的时间窗口分析能力。本文将深入解析Flink的时间语义机制，并通过实战案例演示如何利用窗口操作实现实时数据聚合。一、Flink时间语义详解1.1三种时间概念1.1.1EventTime（事件时间）定义：事件实际发生的时间，由事件本身携带的时间戳决定应用场景：需要准确反映事件真实顺序的场景（
  • Web安全攻防入门教程——hvv行动详解 白帽子黑客罗哥 web安全安全学习网络网络安全
    Web安全攻防入门教程Web安全攻防是指在Web应用程序的开发、部署和运行过程中，保护Web应用免受攻击和恶意行为的技术与策略。这个领域不仅涉及防御措施的实现，还包括通过渗透测试、漏洞挖掘和模拟攻击来识别潜在的安全问题。本教程将带你入门Web安全攻防的基础概念、常见攻击类型、防御技术以及一些实战方法。一、Web安全基础Web应用安全的三大核心目标（CIA三原则）机密性(Confidentialit
  • 前端学习路线：从零基础到初级工程师的完整指南（2025最新版） 超浪的晨 前端学习
    前言作为连接设计与技术的核心岗位，前端开发在数字化时代持续释放强大生命力。本路线图专为初学者设计，通过「渐进式学习路径」+「实战项目驱动」的模式，助你系统掌握现代前端开发技能体系。一、基础筑基阶段（4-6周）三大核心基石HTML5语义化标签（）表单验证与多媒体支持SEO基础与无障碍访问CSS3Flex/Grid布局（重点掌握）动画与过渡（@keyframes+transition）响应式设计（媒体
  • wps打开的excel如何插入、编辑、删除、显示批注？ 阿杜x wps（电脑办公软件）wpsexcel批注
    在WPSOffice中插入Excel批注的步骤与MicrosoftOfficeExcel中的步骤类似。以下是详细步骤：插入批注：打开WPSOffice，然后打开你想要插入批注的Excel文件。定位到你要添加批注的单元格。右键点击该单元格，然后从弹出的菜单中选择“插入批注”。在出现的批注框中输入你的批注文本。输入完成后，点击批注框外部任意位置，即可完成批注的插入。以下是一个更详细的步骤：打开WPSE
  • 通过Java代码实现ping功能测试ip地址与ip:port的连通性 Java大侠 业务代码java功能测试
    通过Java代码实现测试ip地址与ip:port的连通性需求分析具体实现测试ip连通性测试ip:port连通性重试机制需求分析最近在业务中，需要添加一种掉线告警系统。大致思路为：通过定时任务扫描，每一个小时判断一次设备是否在线，如果在线继续判断端口是否能够通讯。如果不在线或者不能通讯，需要及时push消息给告警人员，及时处理。具体实现测试ip连通性主要通过InetAddress类来实现/***@p
  • Servlet 点击计数器 lsx202406 开发语言
    Servlet点击计数器引言随着互联网的快速发展，Web应用程序已成为人们日常生活中不可或缺的一部分。Servlet作为Java平台上用于开发Web应用程序的重要技术之一，已经广泛应用于各种Web项目中。本文将详细介绍Servlet点击计数器的实现方法，帮助读者更好地理解Servlet技术在实际开发中的应用。Servlet点击计数器概述Servlet点击计数器是一种用于记录Web页面点击次数的组件
  • Razor C# 变量 lsx202406 开发语言
    RazorC#变量引言在ASP.NETMVC和Razor视图引擎中，变量是构建动态网页的基础。理解RazorC#变量的使用对于开发者来说至关重要。本文将详细介绍RazorC#变量的概念、类型、作用域以及如何在实际项目中有效使用它们。一、RazorC#变量的概念RazorC#变量是存储在Razor视图中的数据容器。它们可以存储任何类型的值，如字符串、数字、布尔值等。在Razor视图中，变量通过@符号
  • 快速搭建学生信息查询 RESTFul API：Django-Rest-Framework 实现 富阔典
    快速搭建学生信息查询RESTFulAPI：Django-Rest-Framework实现【下载地址】Django-Rest-Framework学生信息查询RESTFulAPI实现代码本仓库提供了一个基于Django-Rest-Framework的学生信息查询RESTFulAPI实现代码。通过该代码，您可以快速搭建一个用于查询学生信息的后端服务，并支持RESTFulAPI接口项目地址:https:/
  • 天道酬勤系列之Ruby 字符串（String）介绍 技术小咖龙 Ruby编程馆Ruby字符串（String）介绍
    Ruby字符串（String）Ruby中的String对象用于存储或操作一个或多个字节的序列。Ruby字符串分为单引号字符串（'）和双引号字符串（"），区别在于双引号字符串能够支持更多的转义字符。单引号字符串最简单的字符串是单引号字符串，即在单引号内存放字符串：'这是一个Ruby程序的字符串'如果您需要在单引号字符串内使用单引号字符，那么需要在单引号字符串使用反斜杠(\)，这样Ruby解释器就不会
  • Docker Compose to Kubernetes 转换工具教程 裴辰垚Simone
    DockerComposetoKubernetes转换工具教程docker-compose-kubernetesLaunchalocalKubernetesclusterviaDockerCompose项目地址:https://gitcode.com/gh_mirrors/do/docker-compose-kubernetes项目介绍本项目旨在提供一个简单的方法，将使用DockerCompose
  • C++（初阶）（七）——模板 win水 c++
    模版模版函数模板概念原理实例化隐式实例化：显式实例化模板参数的匹配原则类模板实例化模版分为函数模板，类模板经过推演实例化出对应函数函数模板概念函数模板代表了一个函数家族，该函数模板与类型无关，在使用时被参数化，根据实参类型产生函数的特定类型版本。template返回值类型函数名(参数列表){}例如，实现简单的交换函数：templateTAdd(constT&left,constT&right){r
  • Java 线程池详解：参数、工作流程与常见线程池 伤心辞 开发语言java
    线程池是Java并发编程中最重要的工具之一，它通过复用线程、控制并发数和任务队列机制，显著提高了多线程程序的性能和资源管理效率。本文将深入解析线程池的核心参数、工作流程，以及如何使用Executors工具类创建常见的线程池。一、线程池的核心参数Java线程池的核心类是ThreadPoolExecutor，其构造函数包含以下关键参数：参数名作用corePoolSize核心线程数，即使线程空闲也不会被
  • Ruby 字符串（String） lsx202406 开发语言
    Ruby字符串（String）在Ruby编程语言中，字符串（String）是处理文本数据的基本数据类型。它是一种可变的字符序列，由一个或多个字符组成。在Ruby中，字符串被广泛用于数据存储、格式化和文本处理。本文将详细介绍Ruby字符串的基本用法、常见方法以及高级特性。1.创建字符串在Ruby中，字符串可以通过多种方式创建：1.1使用单引号s1='Hello,World!'1.2使用双引号s2="
  • C++（初阶）（六）——内存管理 win水 c++
    内存管理内存管理C/C++**内存分布C语言中动态内存管理方式C++内存管理方式new/delete操作内置类型new和delete操作自定义类型new和mallocoperatornew与operatordeletenew和delete的实现原理内置类型自定义类型C/C++**内存分布intglobalVar=1;staticintstaticGlobalVar=1;voidTest(){sta
  • 在重构ZUI中对用户界面实现的思考 zanllp arduinoui
    首先，在写ZUI的时候对编程思想不能很好的理解，只知道面向对象以及面向过程。现在回头看以前写的无疑是面向过程，当然最后对于整个代码封装成类，这个不算这是为了便利性。在重构中认识这种面向过程好处主要是是几点。首先节省内存，这点在像arduinoprominirom32kram2k这类配置极低的单片机来说显得尤为重要。在面向过程中控件的绘制是通过函数来实现的，例如zui的text函数Text(0,0,
  • python中collections_python中的collections weixin_39892481
    python中有大量的内置模块，很多是属于特定开发的功能性模块，但collections是属于对基础数据的类型的补充模块，因此，在日常代码中使用频率更高一些，值得做个笔记，本文只做主要关键字介绍，详细的功能仍然要翻阅官方文档，地址如下：英文站：https://docs.python.org/3.5/library/collections.html中文站：http://python.usyiyi.c
  • 构建我的标签体系（进行中） stone5 未完待续标签体系
    标签的存储数据表设计object表object_label表给已存在的表，附加标签这种情况，这类对象在系统中是较重要的业务对象，往往已建有专门的一张表。对象未建有专门的表打标签有分类的标签如“安全等级”，可以是“高”，“中”，“低”之一，这类标签，本质上是一个字段属性，取值是一个固定范围的列表，不过以标签形式来存储实现而已。无分类的标签如“平安创建单位”，“2023五好家庭”，这类标签更象是标签，
  • Python中的collections模块 木心 #Pythonpython开发语言
    Python中的collections模块文章目录Python中的collections模块1.Counter对象2.deque对象3.defaultdict对象4.namedtuple5.OrderedDictReferencePython中的collections提供许多容器数据类型，这个模块实现了一些专门化的容器，提供了对Python的通用内建容器dict、list、set和tuple的补充
  • 代码随想录算法训练营第八天| 344. 反转字符串、541. 反转字符串II、卡码网：54. 替换数字 Rachela_z 算法python开发语言
    344.反转字符串建议：本题是字符串基础题目，就是考察reverse函数的实现，同时也明确一下平时刷题什么时候用库函数，什么时候不用库函数题目链接/文章讲解/视频讲解：代码随想录状态：用左右指针顺利通过左右指针：classSolution:defreverseString(self,s:List[str])->None:"""Donotreturnanything,modifysin-placei
  • 代码随想录算法训练营第三十七天| 动态规划01 Rachela_z 算法动态规划
    509.斐波那契数很简单的动规入门题，但简单题使用来掌握方法论的，还是要有动规五部曲来分析。代码随想录视频：手把手带你入门动态规划|LeetCode：509.斐波那契数_哔哩哔哩_bilibili动态规划五部曲：确定dp数组（dptable）以及下标的含义确定递推公式dp数组如何初始化确定遍历顺序举例推导dp数组classSolution:deffib(self,n:int)->int:F=[0,
  • HarmonyOS NEXT ArkTS布局优化与性能提升指南 架构教育
    在ArkTS应用开发中，布局优化和性能提升是确保应用流畅运行的关键。本文将从避免二次布局、优先使用layoutWeight、响应式布局设计、懒加载、优化大型对象更新以及内存管理六个方面，探讨如何优化布局和提升性能。避免不必要的二次布局二次布局通常发生在子元素尺寸或位置发生变化时，导致父容器需要重新计算布局。以下是常见的二次布局场景及优化方法：场景1：动态改变子元素尺寸当子元素的尺寸动态变化时（如字
  • HarmonyOS NEXT 开发环境搭建与运动健康类应用开发实战 harmonyos
    随着华为鸿蒙操作系统HarmonyOSNEXT的发布，越来越多的开发者开始关注这一全新的操作系统。HarmonyOSNEXT不仅为用户带来了更流畅、安全的体验，也为开发者提供了强大的开发工具和丰富的API接口。本文将详细介绍如何在HarmonyOSNEXT上搭建开发环境，并通过一个运动健康类跑步燃脂APP的开发实例，帮助开发者快速上手鸿蒙应用开发。一、HarmonyOSNEXT开发环境搭建安装De
  • HarmonyOS NEXT开发环境搭建与健康管理APP开发 harmonyos
    随着华为鸿蒙操作系统HarmonyOSNEXT的推出，开发者们迎来了全新的机遇与挑战。本文将详细介绍如何在HarmonyOSNEXT上搭建开发环境，并通过一个健康管理APP的示例，展示如何进行应用程序的开发。一、开发环境搭建1.安装DevEcoStudio：访问华为开发者官网，下载并安装最新版本的DevEcoStudio。安装过程中，确保勾选所有必要的组件，包括HarmonyOSSDK和工具链。2
  • 策略模式（Strategy Pattern）深度解析教程 java设计模式策略模式
    一、模式定义策略模式属于行为型设计模式，通过定义算法族并将其封装为独立的策略类，使得算法可以动态切换且与使用它的客户端解耦。该模式通过组合替代继承，符合开闭原则（对扩展开放，对修改关闭）。二、核心角色Strategy（策略接口）定义所有支持的算法的公共接口ConcreteStrategy（具体策略）实现策略接口的具体算法Context（上下文）持有策略引用，提供修改策略的方法将客户端请求委托给当前
  • 基于oracle linux的 DBI/DBD 标准化安装文档(六) oracle
    一、安装DBIDBI(DatabaseInterface)是perl连接数据库的接口。其是perl连接数据库的最优方法，他支持包括Orcale,Sybase,mysql,db2等绝大多数的数据库，下面将简要介绍其安装方法。1.1解压tar-zxvfDBI-1.616_901.tar.gz1.2安装依赖yuminstallperl-ExtUtils-CBuilderperl-ExtUtils-Mak
  • 【Agent】OpenManus-Flow组件详细分析 非晓为骁 AIagentaiagi架构openManusManus
    1.Flow架构概述OpenManus的Flow组件实现了一个灵活的工作流管理系统，主要用于协调多个智能体的协作，以完成复杂任务。Flow组件的核心是基于计划的执行模型，它将任务分解为一系列步骤，然后逐步执行这些步骤，直到任务完成。2.核心组件设计2.1BaseFlow(基础Flow)设计特点：使用Pydantic模型实现，支持数据验证和序列化支持多智能体管理，可以灵活配置主要智能体和执行者提供了
  • jsonp 常用util方法 hw1287789687 jsonpjsonp常用方法jsonp callback
    jsonp 常用java方法 (1)以jsonp的形式返回:函数名(json字符串) /*** * 用于jsonp调用 * @param map : 用于构造json数据 * @param callback : 回调的javascript方法名 * @param filters : <code>SimpleBeanPropertyFilter theFilt
  • 多线程场景 alafqq 多线程
    0 能不能简单描述一下你在java web开发中需要用到多线程编程的场景？0 对多线程有些了解，但是不太清楚具体的应用场景，能简单说一下你遇到的多线程编程的场景吗？ Java多线程 2012年11月23日 15:41 Young9007 Young9007 4 0 0 4 Comment添加评论关注(2) 3个答案 按时间排序 按投票排序 0 0 最典型的如： 1、
  • Maven学习——修改Maven的本地仓库路径 Kai_Ge maven
          安装Maven后我们会在用户目录下发现.m2 文件夹。默认情况下，该文件夹下放置了Maven本地仓库.m2/repository。所有的Maven构件(artifact)都被存储到该仓库中，以方便重用。但是windows用户的操作系统都安装在C盘，把Maven仓库放到C盘是很危险的，为此我们需要修改Maven的本地仓库路径。    
  • placeholder的浏览器兼容 120153216 placeholder
    【前言】 自从html5引入placeholder后，问题就来了， 不支持html5的浏览器也先有这样的效果， 各种兼容，之前考虑，今天测试人员逮住不放， 想了个解决办法，看样子还行，记录一下。   【原理】 不使用placeholder，而是模拟placeholder的效果， 大概就是用focus和focusout效果。   【代码】 <scrip
  • debian_用iso文件创建本地apt源 2002wmj Debian
    1.将N个debian-506-amd64-DVD-N.iso存放于本地或其他媒介内，本例是放在本机/iso/目录下 2.创建N个挂载点目录 如下： debian:~#mkdir –r /media/dvd1 debian:~#mkdir –r /media/dvd2 debian:~#mkdir –r /media/dvd3 …. debian:~#mkdir –r /media
  • SQLSERVER耗时最长的SQL 357029540 SQL Server
    对于DBA来说，经常要知道存储过程的某些信息： 1.   执行了多少次 2.   执行的执行计划如何 3.   执行的平均读写如何 4.   执行平均需要多少时间 列名          &
  • com/genuitec/eclipse/j2eedt/core/J2EEProjectUtil 7454103 eclipse
    今天eclipse突然报了com/genuitec/eclipse/j2eedt/core/J2EEProjectUtil 错误，并且工程文件打不开了，在网上找了一下资料，然后按照方法操作了一遍，好了，解决方法如下： 错误提示信息： An error has occurred.See error log for more details. Reason: com/genuitec/
  • 用正则删除文本中的html标签 adminjun javahtml正则表达式去掉html标签
    使用文本编辑器录入文章存入数据中的文本是HTML标签格式，由于业务需要对HTML标签进行去除只保留纯净的文本内容，于是乎Java实现自动过滤。 如下： public static String Html2Text(String inputString) { String htmlStr = inputString; // 含html标签的字符串 String textSt
  • 嵌入式系统设计中常用总线和接口 aijuans linux 基础
                   嵌入式系统设计中常用总线和接口         任何一个微处理器都要与一定数量的部件和外围设备连接，但如果将各部件和每一种外围设备都分别用一组线路与CPU直接连接，那么连线
  • Java函数调用方式——按值传递 ayaoxinchao java按值传递对象基础数据类型
    Java使用按值传递的函数调用方式，这往往使我感到迷惑。因为在基础数据类型和对象的传递上，我就会纠结于到底是按值传递，还是按引用传递。其实经过学习，Java在任何地方，都一直发挥着按值传递的本色。   首先，让我们看一看基础数据类型是如何按值传递的。   public static void main(String[] args) { int a = 2;
  • ios音量线性下降 bewithme ios音量
    直接上代码吧   //second 几秒内下降为0 - (void)reduceVolume:(int)second { KGVoicePlayer *player = [KGVoicePlayer defaultPlayer]; if (!_flag) { _tempVolume = player.volume;
  • 与其怨它不如爱它 bijian1013 选择理想职业规划
            抱怨工作是年轻人的常态，但爱工作才是积极的心态，与其怨它不如爱它。         一般来说，在公司干了一两年后，不少年轻人容易产生怨言，除了具体的埋怨公司“扭门”，埋怨上司无能以外，也有许多人是因为根本不爱自已的那份工作，工作完全成了谋生的手段，跟自已的性格、专业、爱好都相差甚远。  
  • 一边时间不够用一边浪费时间 bingyingao 工作时间浪费
    一方面感觉时间严重不够用，另一方面又在不停的浪费时间。 每一个周末，晚上熬夜看电影到凌晨一点，早上起不来一直睡到10点钟，10点钟起床，吃饭后玩手机到下午一点。 精神还是很差，下午像一直野鬼在城市里晃荡。 为何不尝试晚上10点钟就睡，早上7点就起，时间完全是一样的，把看电影的时间换到早上，精神好，气色好，一天好状态。 控制让自己周末早睡早起，你就成功了一半。 有多少个工作
  • 【Scala八】Scala核心二：隐式转换 bit1129 scala
    Implicits work like this: if you call a method on a Scala object, and the Scala compiler does not see a definition for that method in the class definition for that object, the compiler will try to con
  • sudoku slover in Haskell (2) bookjovi haskellsudoku
    继续精简haskell版的sudoku程序，稍微改了一下，这次用了8行，同时性能也提高了很多，对每个空格的所有解不是通过尝试算出来的，而是直接得出。   board = [0,3,4,1,7,0,5,0,0, 0,6,0,0,0,8,3,0,1, 7,0,0,3,0,0,0,0,6, 5,0,0,6,4,0,8,0,7,
  • Java-Collections Framework学习与总结-HashSet和LinkedHashSet BrokenDreams linkedhashset
            本篇总结一下两个常用的集合类HashSet和LinkedHashSet。         它们都实现了相同接口java.util.Set。Set表示一种元素无序且不可重复的集合；之前总结过的java.util.List表示一种元素可重复且有序
  • 读《研磨设计模式》-代码笔记-备忘录模式-Memento bylijinnan java设计模式
    声明： 本文只为方便我个人查阅和理解，详细的分析以及源代码请移步 原作者的博客http://chjavach.iteye.com/ import java.util.ArrayList; import java.util.List; /* * 备忘录模式的功能是，在不破坏封装性的前提下，捕获一个对象的内部状态，并在对象之外保存这个状态，为以后的状态恢复作“备忘”
  • 《RAW格式照片处理专业技法》笔记 cherishLC PS
    注意，这不是教程！仅记录楼主之前不太了解的 一、色彩（空间）管理 作者建议采用ProRGB（色域最广），但camera raw中设为ProRGB，而PS中则在ProRGB的基础上，将gamma值设为了1.8（更符合人眼） 注意：bridge、camera raw怎么设置显示、输出的颜色都是正确的（会读取文件内的颜色配置文件），但用PS输出jpg文件时，必须先用Edit->conv
  • 使用 Git 下载 Spring 源码 编译 for Eclipse crabdave eclipse
    使用 Git 下载 Spring 源码 编译 for Eclipse   1、安装gradle，下载 http://www.gradle.org/downloads 配置环境变量GRADLE_HOME，配置PATH  %GRADLE_HOME%/bin，cmd，gradle -v   2、spring4 用jdk8 下载 https://jdk8.java.
  • mysql连接拒绝问题 daizj mysql登录权限
    mysql中在其它机器连接mysql服务器时报错问题汇总 一、[running]root@192.168.9.136:~$mysql -uroot -h 192.168.9.108 -p   //带-p参数，在下一步进行密码输入 Enter password:    //无字符串输入 ERROR 1045 (28000): Access
  • Google Chrome 为何打压 H.264 dsjt applehtml5chromeGoogle
    Google 今天在 Chromium 官方博客宣布由于 H.264 编解码器并非开放标准，Chrome 将在几个月后正式停止对 H.264 视频解码的支持，全面采用开放的 WebM 和 Theora 格式。 Google 在博客上表示，自从 WebM 视频编解码器推出以后，在性能、厂商支持以及独立性方面已经取得了很大的进步，为了与 Chromium 现有支持的編解码器保持一致，Chrome
  • yii 获取控制器名 和方法名 dcj3sjt126com yiiframework
    1. 获取控制器名 在控制器中获取控制器名:  $name = $this->getId(); 在视图中获取控制器名:    $name = Yii::app()->controller->id;    2. 获取动作名  在控制器beforeAction()回调函数中获取动作名:  $name =
  • Android知识总结（二） come_for_dream android
    明天要考试了，速速总结如下   1、Activity的启动模式        standard：每次调用Activity的时候都创建一个（可以有多个相同的实例，也允许多个相同Activity叠加。）        singleTop：可以有多个实例，但是不允许多个相同Activity叠加。即，如果Ac
  • 高洛峰收徒第二期：寻找未来的“技术大牛” ——折腾一年，奖励20万元 gcq511120594 工作项目管理
    高洛峰，兄弟连IT教育合伙人、猿代码创始人、PHP培训第一人、《细说PHP》作者、软件开发工程师、《IT峰播》主创人、PHP讲师的鼻祖！ 首期现在的进程刚刚过半，徒弟们真的很棒，人品都没的说，团结互助，学习刻苦，工作认真积极，灵活上进。我几乎会把他们全部留下来，现在已有一多半安排了实际的工作，并取得了很好的成绩。等他们出徒之日，凭他们的能力一定能够拿到高薪，而且我还承诺过一个徒弟，当他拿到大学毕
  • linux expect heipark expect
    1. 创建、编辑文件go.sh   #!/usr/bin/expect spawn sudo su admin expect "*password*" { send "13456\r\n" } interact    2. 设置权限   chmod u+x go.sh  3.
  • Spring4.1新特性——静态资源处理增强 jinnianshilongnian spring 4.1
    目录 Spring4.1新特性——综述 Spring4.1新特性——Spring核心部分及其他 Spring4.1新特性——Spring缓存框架增强 Spring4.1新特性——异步调用和事件机制的异常处理 Spring4.1新特性——数据库集成测试脚本初始化 Spring4.1新特性——Spring MVC增强 Spring4.1新特性——页面自动化测试框架Spring MVC T
  • idea ubuntuxia 乱码 liyonghui160com
      1.首先需要在windows字体目录下或者其它地方找到simsun.ttf 这个 字体文件。 2.在ubuntu 下可以执行下面操作安装该字体： sudo mkdir /usr/share/fonts/truetype/simsun sudo cp simsun.ttf /usr/share/fonts/truetype/simsun fc-cache -f -v
  • 改良程序的11技巧 pda158 技巧
    有很多理由都能说明为什么我们应该写出清晰、可读性好的程序。最重要的一点，程序你只写一次，但以后会无数次的阅读。当你第二天回头来看你的代码 时，你就要开始阅读它了。当你把代码拿给其他人看时，他必须阅读你的代码。因此，在编写时多花一点时间，你会在阅读它时节省大量的时间。   让我们看一些基本的编程技巧：   尽量保持方法简短 永远永远不要把同一个变量用于多个不同的
  • 300个涵盖IT各方面的免费资源（下）——工作与学习篇 shoothao 创业免费资源学习课程远程工作
    工作与生产效率:   A. 背景声音 Noisli:背景噪音与颜色生成器。 Noizio:环境声均衡器。 Defonic:世界上任何的声响都可混合成美丽的旋律。 Designers.mx:设计者为设计者所准备的播放列表。 Coffitivity:这里的声音就像咖啡馆里放的一样。 B. 避免注意力分散 Self Co
  • 深入浅出RPC uule rpc
    深入浅出RPC-浅出篇 深入浅出RPC-深入篇   RPC Remote Procedure Call Protocol 远程过程调用协议   它是一种通过网络从远程计算机程序上请求服务，而不需要了解底层网络技术的协议。RPC协议假定某些传输协议的存在，如TCP或UDP，为通信程序之间携带信息数据。在OSI网络通信模型中，RPC跨越了传输层和应用层。RPC使得开发
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他