Kinghiee
Kinghiee

父元素中有transform, perspective 或 filter时，fixed子元素如何呈现

前几天做项目的时候，因为对position：fixed属性有认识不全面，然后就导致做弹出层的时候弹出层不能覆盖整个浏览器可视窗口 。

之前认为设置fixed的元素会被移出正常文档流，并不为元素预留空间，而是通过指定元素相对于屏幕视口（viewport）的位置来指定元素位置。元素的位置在屏幕滚动时不会改变。打印时，元素会出现在的每页的固定位置。fixed 属性会创建新的层叠上下文。
但fixed解释还有一部分就是，当元素祖先的 transform, perspective 或 filter 属性非 none 时，容器由视口改为该祖先。

今天就场景复现一下。

一、父元素无transform, perspective 或 filter 时，弹出层呈现

效果图
父元素中有transform, perspective 或 filter时，fixed子元素如何呈现_第1张图片
父元素中有transform, perspective 或 filter时，fixed子元素如何呈现_第2张图片
父元素没有transform, perspective 或 filter 时，弹出层覆盖整个浏览器视口

代码

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style>
			html,body{
     
				padding: 0;
				margin: 0;
				height: 100%;
			}
			.main{
     
				height: 100%;
				display: flex;
				/* background-color: darkgoldenrod; */
			}
			/*左边样式*/
			.main > .left{
     
				height: 100%;
				border: 1px solid firebrick;
				box-sizing: border-box;
				background-color: blueviolet;
				flex: 1 1 auto;
				
			}
			/*弹出层样式*/
			.pop-modal-content{
     
			    position: fixed;
			    width: 100%;
			    height: 100%;
			    left: 0;
			    top: 0;
			    background-color: rgba(0,0,0,0.40);
			    display: none;
			}
			.pop-container{
     
			    position: absolute;
			    left: 0;
			    right: 0;
			    top: 0;
			    bottom: 0;
			    margin: auto;
			    width: 460px;
			    height: 290px;
			    padding: 56.1px 87px 48px 88px;
			    background: #FFFFFF;
			    box-shadow: 0 8px 64px 0 rgba(0,0,0,0.15);
			}
			.close{
     
			    line-height: 14px;
			    width: 14px;
			    text-align: center;
			    position: absolute;
			    right: 25px;
			    top: 25px;
			    color: #999999;
			    cursor: pointer;
			  }
		</style>
	</head>
	<body>
		<div class="main">
			<div class="left">
				<button id="test1">弹出层</button>
				  <div class="pop-modal-content">
				    <!--弹出层-->
				    <div class="pop-container">
				      <div class="close">
				        ×
				      </div>
				      <div class="pop-content">
				            12346
				      </div>
				    </div>
				  </div>
			</div>
		</div>
	</body>
	<script>
	     /*test1开启弹出层事件*/
		 function test1(){
     
			 document.getElementsByClassName("pop-modal-content")[0].style="display:block;";
		 }
		/*关闭弹出层事件*/
		function close(){
     
			document.getElementsByClassName("pop-modal-content")[0].style="display:none;";
		}
		document.getElementById("test1").addEventListener("click",test1);
		document.getElementsByClassName("close")[0].addEventListener("click",close);
		
	</script>
</html>

二、父元素有transform, perspective 或 filter 时，弹出层呈现

效果图
父元素中有transform, perspective 或 filter时，fixed子元素如何呈现_第3张图片
父元素中有transform, perspective 或 filter时，fixed子元素如何呈现_第4张图片
可以发现视口改为了当前的父元素，这样就不会占据整个浏览器。

代码

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style>
			html,body{
     
				padding: 0;
				margin: 0;
				height: 100%;
			}
			.main{
     
				height: 100%;
				display: flex;
				/* background-color: darkgoldenrod; */
			}
			/*左边样式*/
			.main > .left{
     
				height: 100%;
				border: 1px solid firebrick;
				box-sizing: border-box;
				background-color: blueviolet;
				flex: 1 1 auto;
				
			}
			/*右边样式*/
			.main > .right{
     
				height: 100%;
				border: 1px solid chartreuse;
				box-sizing: border-box;
				background-color: #B22222;
				flex: 1 1 auto;
				position: fixed;
				right: 0;
				width: 600px;
				transform: translateX(10px);
				/* perspective:150;
				-webkit-perspective:150; /* Safari and Chrome */ */
				/* -webkit-filter: grayscale(100%); /* Chrome, Safari, Opera */
				    filter: grayscale(100%); */
			}
			/*弹出层样式*/
			.pop-modal-content{
     
			    position: fixed;
			    width: 100%;
			    height: 100%;
			    left: 0;
			    top: 0;
			    background-color: rgba(0,0,0,0.40);
			    display: none;
			}
			.pop-container{
     
			    position: absolute;
			    left: 0;
			    right: 0;
			    top: 0;
			    bottom: 0;
			    margin: auto;
			    width: 460px;
			    height: 290px;
			    padding: 56.1px 87px 48px 88px;
			    background: #FFFFFF;
			    box-shadow: 0 8px 64px 0 rgba(0,0,0,0.15);
			}
			.close{
     
			    line-height: 14px;
			    width: 14px;
			    text-align: center;
			    position: absolute;
			    right: 25px;
			    top: 25px;
			    color: #999999;
			    cursor: pointer;
			  }
		</style>
	</head>
	<body>
		<div class="main">
			<div class="left">
				<button id="test1">弹出层</button>
				  <div class="pop-modal-content">
				    <!--弹出层-->
				    <div class="pop-container">
				      <div class="close">
				        ×
				      </div>
				      <div class="pop-content">
				            12346
				      </div>
				    </div>
				  </div>
			</div>
			<div class="right">
				<button id="test2">父元素有transform属性的弹出层</button>
				  <div class="pop-modal-content" id="pop2">
				    <!--弹出层-->
				  <div class="pop-container">
				      <div class="close">
				        ×
				      </div>
				      <div class="pop-content">
				            pop2
				      </div>
				    </div>
				  </div>
			</div>
		</div>
	</body>
	<script>
	     /*test1开启弹出层事件*/
		 function test1(){
     
			 document.getElementsByClassName("pop-modal-content")[0].style="display:block;";
		 }
		/*关闭弹出层事件*/
		function close(){
     
			document.getElementsByClassName("pop-modal-content")[0].style="display:none;";
		}
		document.getElementById("test1").addEventListener("click",test1);
		document.getElementsByClassName("close")[0].addEventListener("click",close);
		
		
		/*test2*/
		function test2(){
     
			 document.getElementById("pop2").style="display:block;";
		 }
		/*关闭弹出层事件*/
		function close2(){
     
			document.getElementById("pop2").style="display:none;";
		}
		document.getElementById("test2").addEventListener("click",test2);
		document.getElementsByClassName("close")[1].addEventListener("click",close2);
	</script>
</html>

你可能感兴趣的:(css,fixed,transform,perspective,filter)

  • 深入理解AIGC背后的核心算法：GAN、Transformer与Diffusion Models 忘梓. 杂文AIGC算法生成对抗网络
    深入理解AIGC背后的核心算法：GAN、Transformer与DiffusionModels前言随着人工智能技术的发展，AIGC（AIGeneratedContent，人工智能生成内容）已经不再是科幻电影中的幻想，而成为了现实生活中的一种新兴力量。无论是自动生成文章、绘制图像、生成音乐还是创作视频，AIGC都在各个内容创作领域崭露头角。然而，这些“智能创作”的背后究竟依赖于哪些算法？今天，我们将
  • 如何使用LangChain的`filter_messages`过滤消息 dagGAIYD langchainjava数据库python
    在复杂的对话链和代理中，我们常常需要维护一个消息列表。这个列表可能会积累来自多个不同模型、讲述者、子链等的消息。为了确保每次模型调用时只处理所需的消息，我们可以使用filter_messages实用工具来按类型、ID或名称过滤消息。技术背景介绍在对话系统或智能代理的开发中，管理消息状态是一项重要任务。随着对话深度的增加，消息列表可能会变得庞杂。因此，仅传递消息列表的子集至每个模型调用成为必要。此时
  • HTML静态网页作业(HTML+CSS)——外卖平台主题网页设计制作(8个页面) 2501_90365653 htmlcss学生网页htmlcss前端
    不定期分享源码，关注不丢失哦文章目录一、作品介绍二、作品演示1、首页2、商家列表页3、商家详情页4、商家图片页三、代码目录四、网站代码五、源码获取一、作品介绍️本套采用DIV+CSS布局，未使用Javacsript代码，共有8个页面。二、作品演示1、首页2、商家列表页3、商家详情页4、商家图片页三、代码目录四、网站代码北京[更换]你好，请登录/注册全部分类全部商家商家入驻关于我们常见问题我要登录用
  • Apache SeaTunnel 2.3.9 正式发布：多项新特性与优化全面提升数据集成能力 数据库
    近日，ApacheSeaTunnel社区正式发布了最新版本2.3.9。本次更新新增了`Helm集群部署、Transform支持多表、Zeta新API、表结构转换、任务提交队列、分库分表合并、列转多行`等多个功能更新！作为一款开源、分布式的数据集成平台，本次版本通过新增功能、性能优化与问题修复，为开发者与企业用户带来了更加全面的支持。2.3.9版本下载：https://seatunnel.apach
  • three.js Canvas纹理（CanvasTexture）、压缩的纹理（CompressedTexture） 灵魂清零 threejavascript开发语言ecmascript前端
    从Canvas元素中创建纹理贴图。它几乎与其基类Texture相同，但它直接将needsUpdate（需要更新）设置为了true。构造函数CanvasTexture(canvas:HTMLElement,mapping:Constant,wrapS:Constant,wrapT:Constant,magFilter:Constant,minFilter:Constant,format:Consta
  • 【Linux奇遇记】我和Linux的初次相遇 2401_89210258 linux状态模式运维
    Linux的文件路径类型编辑Linux常用命令介绍Linux在生活中的应用全文总结前端和后端的介绍前端和后端是指现代Web应用程序的两个主要组成部分。1.前端前端（也称为客户端）是指向用户显示内容的所有方面。前端开发涉及使用HTML、CSS和JavaScript等技术来创建和维护Web应用程序的用户接口。2.后端后端（也称为服务器端）是指Web应用程序的非用户界面部分。后端开发涉及使用不同的编程语
  • 2024年Vue面试题汇总 2401_89210258 vue.js前端javascript
    流程图如下：vue核心知识——语法篇1.请问v-if和v-show有什么区别？相同点：两者都是在判断DOM节点是否要显示。不同点：a.实现方式：v-if是根据后面数据的真假值判断直接从Dom树上删除或重建元素节点。v-show只是在修改元素的css样式，也就是display的属性值，元素始终在Dom树上。b.编译过程：v-if切换有一个局部编译/卸载的过程，切换过程中合适地销毁和重建内部的事件监听
  • 路由规则的匹配优先级 我没想到原来他们都是一堆坏人 服务器微服务
    路由规则的匹配优先级路由规则是从上到下匹配的，一旦匹配成功，就不会再考虑下面的规则。现有以下两条路由规则：-id:admin_routeuri:lb://renren-fastpredicates:-Path=/api/**filters:-RewritePath=/api/(?/?.*),/renren-fast/$\{segment}-id:product_routeuri:lb://guli
  • 每日读码1 Unity GL hookby 每日读码unity
    //一般在渲染函数里实现，比如：OnPostRender()/*相机后处理*/,OnRenderImage()/*图像处理*/voidOnRenderImage(RenderTexturesrc,RenderTexturedst){Vector3toRight=cameraTransform.right*halfHeight*aspect;Vector3toTop=cameraTransform.
  • 【2025年】全国CTF夺旗赛-从零基础入门到竞赛，看这一篇就稳了！ 白帽黑客鹏哥 linux网络安全web安全密码学CTF夺旗赛
    基于入门网络安全/黑客打造的：黑客&网络安全入门&进阶学习资源包目录一、CTF简介二、CTF竞赛模式三、CTF各大题型简介四、CTF学习路线4.1、初期1、html+css+js（2-3天）2、apache+php（4-5天）3、mysql（2-3天）4、python(2-3天)5、burpsuite（1-2天）4.2、中期1、SQL注入（7-8天）2、文件上传（7-8天）3、其他漏洞（14-15
  • gds文件 导出_GaussDB 200使用GDS服务导入导出数据 weixin_39576066 gds文件导出
    GaussDB200支持将存在远端服务器上的TEXT、CSV和FIXED格式的数据导入到集群中。本文介绍使用GDS(GaussDataService)工具将远端服务器上的数据导入GaussDB200。环境如下表:1、准备源数据这里从PostgreSQL数据库中，使用copy命令导出一个csv格式的文件，如下：rhnschema=>copyrhnpackagefileto'/tmp/rhnpacka
  • 基于JAVA水果商城设计计算机毕业设计源码+数据库+lw文档+系统+部署 柳下网络 java开发语言jvm
    基于JAVA水果商城设计计算机毕业设计源码+数据库+lw文档+系统+部署基于JAVA水果商城设计计算机毕业设计源码+数据库+lw文档+系统+部署本源码技术栈：项目架构：B/S架构开发语言：Java语言开发软件：ideaeclipse前端技术：Layui、HTML、CSS、JS、JQuery等技术后端技术：JAVA运行环境：Win10、JDK1.8数据库：MySQL5.7/8.0源码地址：https
  • SpringBoot+restFul+filter+threadLocal实现多租户的项目 梦想一直在路上
    本片博客参考了https://blog.csdn.net/gebitan505/article/details/51614805threadLocal的目的是:实现变量的全局话,在当前的项目当中是实现了用户名的多租户状态下的全局话fiter:进行token的拦截,ThreadLocal的代码packagecom.zwl.util;importjava.util.HashMap;importjava
  • AI时代的前端开发：技能提升与职业发展之路 前端
    在瞬息万变的科技时代，个人职业发展的重要性日益凸显。提升技能，不断学习，已经不再是锦上添花，而是立足之本，是我们在竞争激烈的职场中脱颖而出的关键。而人工智能（AI）技术的快速发展，为我们提供了前所未有的机遇，特别是对于前端开发领域，AI正以前所未有的速度改变着我们的工作方式和学习方式。AI赋能前端开发：个性化学习路径前端开发领域的技术栈庞大而复杂，涵盖HTML、CSS、JavaScript、各种框
  • ATB是什么？ 人工智能深度学习
    1ATB介绍AscendTransformerBoost加速库（下文简称为ATB加速库）是一款高效、可靠的加速库，基于华为AscendAI处理器，专门为Transformer类模型的训练和推理而设计。ATB加速库采用了一系列优化策略，包括算法优化、硬件优化和软件优化，能够显著提升Transformer模型的训练和推理速度，同时降低能耗和成本。具体来说，ATB加速库通过优化矩阵乘法等核心算子和注意力
  • golang gorm查询任意字段的组装方法 用户昵称不能为空 golang开发语言后端
    查询指定未知长度字段的汇总方法packagemainimport("fmt""github.com/jinzhu/gorm"_"github.com/jinzhu/gorm/dialects/mysql""log""strings")typeFilterDostruct{}typeScanFieldsinterface{IsScanField()bool}typeSummarystruct{Num
  • css hover样式调试 monstkl csscss前端javascript
    调试hover后才出现的元素如何调试打开开发者工具，鼠标放在hover时才出现的元素上，然后点击右键不要选中任何选项，将鼠标移动到开发者工具的调试面板中按下N键，此时悬浮的元素不会消失，定位成功调试元素悬浮样式选中有hover样式的元素在开发者工具中选择:hov，就可以看到了
  • CSS 高效开发秘籍：日常总结与实战技巧-1
    column-gap的影响column-gap属性用来设置元素列之间的间隔大小。在未触发的时候，弹窗是隐藏的，但是column-gap会将其计算在内，导致最后一个div也会产生gap间隙，解决方法就是将拿出来，在外面再套一层div另外，下面这种写法不会对column-gap造成影响，因为它始终保持3个dom根据标签属性判断css:css[]css[]可以匹配带有指定名称的标签div[role="g
  • Kotlin 协程Flow主要操作符(一) 许三多2020 Kotlin基础android基础Kotlin协程KotlinAndroid协程操作符协程
    Kotlin协程Flow主要操作符（一）1.主要导包2.map转换操作符3.filter过滤操作符4.take限长操作符5.drop丢弃操作符6.flowOn操作符7.onStart操作符8.onCompletion完成操作符9.catch异常收集操作符10.buffer缓冲操作符11.conflate合并操作符参考1.主要导包//协程包implementation"org.jetbrains.k
  • 页面雪花飘落（html、CSS、JS） 小姐姐呀～ htmlcssjavascript
    *{margin:0;padding:0;}#box{width:100vw;height:100vh;padding:3px;position:absolute;background:black;}(function(){varscreenWidth=screen.availWidth;//获取屏幕宽度varscreenHeight=screen.availHeight;//获取屏幕高度vars
  • 一句话就能回答的前端面试题（2024年10月最新版） 小姐姐呀～ 前端javascriptvue
    1、v-if和v-show的区别相同点:v-if和v-show都可以控制dom元素的展示和隐藏不同点：v-if的显示隐藏是将dom元素整个添加或删除而v-show的隐藏是为该元素添加CSS样式display:none,dom元素还在一般进入页面不需要频繁显示或隐藏就用v-if2、data()为什么是一个函数为了防止多个组件实例对象共用一个data，产生数据污染3、什么是闭包闭包就是内部函数定义一个
  • Parcel打包探讨 Gavin13140 前端技术前端打包parceljsparcel
    Parcel探讨卖点：1.极速打包时间Parcel使用worker进程去启用多核编译。同时有文件系统缓存，即使在重启构建后也能快速再编译。2.打包所有的资源Parcel具备开箱即用的对JS,CSS,HTML,文件及更多的支持，而且不需要插件。3.自动转换在需要时，代码使用Babel，PostCSS和PostHTML自动转换4.零配置代码分拆使用动态import()语法,Parcel将你的输出文件束
  • 深入浅出：Tailwind CSS 详解 chenNorth。 csscss前端
    TailwindCSS是一款功能强大的、低级的CSS框架，它与传统的CSS框架（如Bootstrap或Foundation）不同，它不提供具体的UI组件，而是通过实用工具类来帮助开发者更灵活、更高效地构建自定义的网页设计。TailwindCSS强调“原子化”CSS，这意味着它通过大量的小工具类（UtilityClasses）来定义网页元素的样式，而不是通过写大量的自定义CSS代码。这种方式让开发者
  • Jmeter-1-JMeter代理录制脚本 karry_孙二 JmeterJmeter
    jmeter代理录制脚本1.原理：把jmeter作为代理服务器2.代理：相当于中转站3.流程：浏览器（客户端）--->jmeter--->服务器步骤1.设置浏览器为代理模式2.jm新建代理服务器，设置3.设置过滤规则录制脚本：jmeter只能录制html包含模式：.*192\.168\.0\.203.*（.要用\来转译）排除模式：.*\.js.*|.*\.css.*|.*\.png.*|.*\.g
  • 一文看懂llama2（原理&模型&训练） Qpeterqiufengyi llama
    自从Transformer架构问世以来，大型语言模型（LargeLanguageModels,LLMs）以及AIGC技术的发展速度惊人，它们不仅在技术层面取得了重大突破，还在商业应用、社会影响等多个层面展现出巨大潜力。随着ChatGPT的推出，这一技术日益走进大众视野，这也预示着一个由生成式AI塑造的未来正在加速到来。与此同时，MetaAIMetaAI在2023年推出了LLama（LargeLan
  • 提升YOLOv8性能：用Swin Transformer替换Backbone的详细实现与分析【YOLOv8】 步入烟尘 YOLO系列创新涨点超专栏YOLOv8YOLO目标跟踪
    本专栏专为AI视觉领域的爱好者和从业者打造。涵盖分类、检测、分割、追踪等多项技术，带你从入门到精通！后续更有实战项目，助你轻松应对面试挑战！立即订阅，开启你的YOLOv8之旅！专栏订阅地址：https://blog.csdn.net/mrdeam/category_12804295.html文章目录YOLOv8改进|主干篇|SwinTransformer替换Backbone（附代码+详细修改步骤+
  • YOLOv8与Transformer：探索目标检测的新架构 AI架构设计之禅 AI大模型应用入门实战与进阶大数据AI人工智能计算科学神经计算深度学习神经网络大数据人工智能大型语言模型AIAGILLMJavaPython架构设计AgentRPA
    YOLOv8与Transformer：探索目标检测的新架构关键词：目标检测，深度学习，YOLOv8，Transformer，计算机视觉，卷积神经网络摘要：目标检测是计算机视觉领域的一项重要任务，其目标是从图像或视频中识别和定位特定对象。近年来，YOLO（YouOnlyLookOnce）系列算法以其高精度和高速度成为目标检测领域的佼佼者。最新版本的YOLOv8引入了Transformer架构，进一步
  • 一篇文章告诉你什么是BloomFilter 后端
    什么是BloomFilter布隆过滤器（英语：BloomFilter）是1970年由布隆提出的。它实际上是一个很长的二进制向量和一系列随机映射函数。主要用于判断一个元素是否在一个集合中。通常我们会遇到很多要判断一个元素是否在某个集合中的业务场景，一般想到的是将集合中所有元素保存起来，然后通过比较确定。链表、树、散列表（又叫哈希表，Hashtable）等等数据结构都是这种思路。但是随着集合中元素的增
  • CSS 布局的四大宗师：破解 BFC、IFC、GFC 和 FFC 的深层奥秘 dorabighead 前端八股总结css前端
    CSS布局的四大宗师：破解BFC、IFC、GFC和FFC的深层奥秘在CSS的江湖中，布局问题犹如无形的桎梏，困扰着每一位前端开发者。有人为浮动塌陷而抓狂，有人被复杂的响应式布局逼得手足无措。而在布局的巅峰，有四位宗师——BFC、IFC、GFC和FFC，它们分别掌控着块级、行内、网格和弹性布局的精髓。掌握它们，不仅仅是技术的进步，更是开启布局新境界的钥匙。今天，我们不再止步于表面，而是深入到它们的核
  • uniapp中使用全局样式文件引入的三种方式 上趣工作室 uniappvue3.xvue2.xuni-apprust开发语言
    如果你想在uni-app中全局引入SCSS文件（例如global.scss），可以通过以下步骤进行配置：方法一：在main.js中引入在main.js中引入全局样式：你可以在src/main.js文件中直接引入SCSS文件，这样可以确保在整个应用中都可以使用这些样式。//src/main.jsimportVuefrom'vue';importAppfrom'./App.vue';import'./
  • [星球大战]阿纳金的背叛 comsci
          本来杰迪圣殿的长老是不同意让阿纳金接受训练的.........     但是由于政治原因,长老会妥协了...这给邪恶的力量带来了机会     所以......现代的地球联邦接受了这个教训...绝对不让某些年轻人进入学院    
  • 看懂它，你就可以任性的玩耍了！ aijuans JavaScript
              javascript作为前端开发的标配技能，如果不掌握好它的三大特点：1.原型 2.作用域 3. 闭包 ,又怎么可以说你学好了这门语言呢？如果标配的技能都没有撑握好，怎么可以任性的玩耍呢？怎么验证自己学好了以上三个基本点呢，我找到一段不错的代码，稍加改动，如果能够读懂它，那么你就可以任性了。 function jClass(b
  • Java常用工具包 Jodd Kai_Ge javajodd
    Jodd 是一个开源的 Java 工具集， 包含一些实用的工具类和小型框架。简单，却很强大！ 写道 Jodd = Tools + IoC + MVC + DB + AOP + TX + JSON + HTML < 1.5 Mb Jodd 被分成众多模块，按需选择，其中 工具类模块有： jodd-core    &nb
  • SpringMvc下载 120153216 springMVC
    @RequestMapping(value = WebUrlConstant.DOWNLOAD) public void download(HttpServletRequest request,HttpServletResponse response,String fileName) { OutputStream os = null; InputStream is = null;
  • Python 标准异常总结 2002wmj python
    Python标准异常总结 AssertionError 断言语句（assert）失败 AttributeError 尝试访问未知的对象属性 EOFError 用户输入文件末尾标志EOF（Ctrl+d） FloatingPointError 浮点计算错误 GeneratorExit generator.close()方法被调用的时候 ImportError 导入模块失
  • SQL函数返回临时表结构的数据用于查询 357029540 SQL Server
    这两天在做一个查询的SQL，这个SQL的一个条件是通过游标实现另外两张表查询出一个多条数据，这些数据都是INT类型，然后用IN条件进行查询，并且查询这两张表需要通过外部传入参数才能查询出所需数据，于是想到了用SQL函数返回值，并且也这样做了，由于是返回多条数据，所以把查询出来的INT类型值都拼接为了字符串，这时就遇到问题了，在查询SQL中因为条件是INT值，SQL函数的CAST和CONVERST都
  • java 时间格式化 | 比较大小| 时区 个人笔记 7454103 javaeclipsetomcatcMyEclipse
    个人总结！ 不当之处多多包含！ 引用 1.0 如何设置 tomcat 的时区：          位置：(catalina.bat---JAVA_OPTS  下面加上)          set JAVA_OPT
  • 时间获取Clander的用法 adminjun Clander时间
    /**    * 得到几天前的时间    * @param d    * @param day    * @return    */   public static Date getDateBefore(Date d,int day){    Calend
  • JVM初探与设置 aijuans java
    JVM是Java Virtual Machine（Java虚拟机）的缩写，JVM是一种用于计算设备的规范，它是一个虚构出来的计算机，是通过在实际的计算机上仿真模拟各种计算机功能来实现的。Java虚拟机包括一套字节码指令集、一组寄存器、一个栈、一个垃圾回收堆和一个存储方法域。 JVM屏蔽了与具体操作系统平台相关的信息，使Java程序只需生成在Java虚拟机上运行的目标代码（字节码）,就可以在多种平台
  • SQL中ON和WHERE的区别 avords
    SQL中ON和WHERE的区别   数据库在通过连接两张或多张表来返回记录时，都会生成一张中间的临时表，然后再将这张临时表返回给用户。   www.2cto.com   在使用left jion时，on和where条件的区别如下：  1、 on条件是在生成临时表时使用的条件，它不管on中的条件是否为真，都会返回左边表中的记录。 
  • 说说自信 houxinyou 工作生活
    自信的来源分为两种,一种是源于实力,一种源于头脑.实力是一个综合的评定,有自身的能力,能利用的资源等.比如我想去月亮上,要身体素质过硬,还要有飞船等等一系列的东西.这些都属于实力的一部分.而头脑不同,只要你头脑够简单就可以了!同样要上月亮上,你想,我一跳,1米,我多跳几下,跳个几年,应该就到了!什么?你说我会往下掉?你笨呀你!找个东西踩一下不就行了吗?     无论工作还
  • WEBLOGIC事务超时设置 bijian1013 weblogicjta事务超时
            系统中统计数据，由于调用统计过程，执行时间超过了weblogic设置的时间，提示如下错误： 统计数据出错! 原因：The transaction is no longer active - status: 'Rolling Back. [Reason=weblogic.transaction.internal
  • 两年已过去，再看该如何快速融入新团队 bingyingao java互联网融入架构新团队
    偶得的空闲，翻到了两年前的帖子 该如何快速融入一个新团队，有所感触，就记下来，为下一个两年后的今天做参考。     时隔两年半之后的今天，再来看当初的这个博客，别有一番滋味。而我已经于今年三月份离开了当初所在的团队，加入另外的一个项目组，2011年的这篇博客之后的时光，我很好的融入了那个团队，而直到现在和同事们关系都特别好。大家在短短一年半的时间离一起经历了一
  • 【Spark七十七】Spark分析Nginx和Apache的access.log bit1129 apache
    Spark分析Nginx和Apache的access.log，第一个问题是要对Nginx和Apache的access.log文件进行按行解析，按行解析就的方法是正则表达式：   Nginx的access.log解析正则表达式   val PATTERN = """([^ ]*) ([^ ]*) ([^ ]*) (\\[.*\\]) (\&q
  • Erlang patch bookjovi erlang
    Totally five patchs committed to erlang otp, just small patchs. IMO, erlang really is a interesting programming language, I really like its concurrency feature. but the functional programming style
  • log4j日志路径中加入日期 bro_feng javalog4j
    要用log4j使用记录日志，日志路径有每日的日期，文件大小5M新增文件。 实现方式 log4j: <appender name="serviceLog" class="org.apache.log4j.RollingFileAppender"> <param name="Encoding" v
  • 读《研磨设计模式》-代码笔记-桥接模式 bylijinnan java设计模式
    声明： 本文只为方便我个人查阅和理解，详细的分析以及源代码请移步 原作者的博客http://chjavach.iteye.com/ /** * 个人觉得关于桥接模式的例子，蜡笔和毛笔这个例子是最贴切的：http://www.cnblogs.com/zhenyulu/articles/67016.html * 笔和颜色是可分离的，蜡笔把两者耦合在一起了：一支蜡笔只有一种
  • windows7下SVN和Eclipse插件安装 chenyu19891124 eclipse插件
    今天花了一天时间弄SVN和Eclipse插件的安装，今天弄好了。svn插件和Eclipse整合有两种方式，一种是直接下载插件包，二种是通过Eclipse在线更新。由于之前Eclipse版本和svn插件版本有差别，始终是没装上。最后在网上找到了适合的版本。所用的环境系统：windows7JDK：1.7svn插件包版本：1.8.16Eclipse：3.7.2工具下载地址：Eclipse下在地址：htt
  • [转帖]工作流引擎设计思路 comsci 设计模式工作应用服务器workflow企业应用
    作为国内的同行，我非常希望在流程设计方面和大家交流，刚发现篇好文(那么好的文章，现在才发现，可惜)，关于流程设计的一些原理，个人觉得本文站得高，看得远，比俺的文章有深度，转载如下 ================================================================================= 自开博以来不断有朋友来探讨工作流引擎该如何
  • Linux 查看内存，CPU及硬盘大小的方法 daizj linuxcpu内存硬盘大小
    一、查看CPU信息的命令 [root@R4 ~]# cat /proc/cpuinfo |grep "model name" && cat /proc/cpuinfo |grep "physical id" model name : Intel(R) Xeon(R) CPU X5450 @ 3.00GHz model name :
  • linux 踢出在线用户 dongwei_6688 linux
    两个步骤： 1.用w命令找到要踢出的用户，比如下面：   [root@localhost ~]# w 18:16:55 up 39 days, 8:27, 3 users, load average: 0.03, 0.03, 0.00 USER TTY FROM LOGIN@ IDLE JCPU PCPU WHAT
  • 放手吧,就像不曾拥有过一样 dcj3sjt126com
    内容提要： 静悠悠编著的《放手吧就像不曾拥有过一样》集结“全球华语世界最舒缓心灵”的精华故事，触碰生命最深层次的感动，献给全世界亿万读者。《放手吧就像不曾拥有过一样》的作者衷心地祝愿每一位读者都给自己一个重新出发的理由，将那些令你痛苦的、扛起的、背负的，一并都放下吧！把憔悴的面容换做一种清淡的微笑，把沉重的步伐调节成春天五线谱上的音符，让自己踏着轻快的节奏，在人生的海面上悠然漂荡，享受宁静与
  • php二进制安全的含义 dcj3sjt126com PHP
    PHP里，有string的概念。 string里，每个字符的大小为byte（与PHP相比，Java的每个字符为Character，是UTF8字符，C语言的每个字符可以在编译时选择）。 byte里，有ASCII代码的字符，例如ABC，123，abc，也有一些特殊字符，例如回车，退格之类的。 特殊字符很多是不能显示的。或者说，他们的显示方式没有标准，例如编码65到哪儿都是字母A，编码97到哪儿都是字符
  • Linux下禁用T440s，X240的一体化触摸板(touchpad) gashero linuxThinkPad触摸板
    自打1月买了Thinkpad T440s就一直很火大，其中最让人恼火的莫过于触摸板。   Thinkpad的经典就包括用了小红点(TrackPoint)。但是小红点只能定位，还是需要鼠标的左右键的。但是自打T440s等开始启用了一体化触摸板，不再有实体的按键了。问题是要是好用也行。   实际使用中，触摸板一堆问题，比如定位有抖动，以及按键时会有飘逸。这就导致了单击经常就
  • graph_dfs hcx2013 Graph
    package edu.xidian.graph; class MyStack { private final int SIZE = 20; private int[] st; private int top; public MyStack() { st = new int[SIZE]; top = -1; } public void push(i
  • Spring4.1新特性——Spring核心部分及其他 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
  • 配置HiveServer2的安全策略之自定义用户名密码验证 liyonghui160com
        具体从网上看   http://doc.mapr.com/display/MapR/Using+HiveServer2#UsingHiveServer2-ConfiguringCustomAuthentication   LDAP Authentication using OpenLDAP Setting
  • 一位30多的程序员生涯经验总结 pda158 编程工作生活咨询
    1.客户在接触到产品之后，才会真正明白自己的需求。 　　这是我在我的第一份工作上面学来的。只有当我们给客户展示产品的时候，他们才会意识到哪些是必须的。给出一个功能性原型设计远远比一张长长的文字表格要好。 2.只要有充足的时间，所有安全防御系统都将失败。 　　安全防御现如今是全世界都在关注的大课题、大挑战。我们必须时时刻刻积极完善它，因为黑客只要有一次成功，就可以彻底打败你。   3.
  • 分布式web服务架构的演变 自由的奴隶 linuxWeb应用服务器互联网
    最开始，由于某些想法，于是在互联网上搭建了一个网站，这个时候甚至有可能主机都是租借的，但由于这篇文章我们只关注架构的演变历程，因此就假设这个时候已经是托管了一台主机，并且有一定的带宽了，这个时候由于网站具备了一定的特色，吸引了部分人访问，逐渐你发现系统的压力越来越高，响应速度越来越慢，而这个时候比较明显的是数据库和应用互相影响，应用出问题了，数据库也很容易出现问题，而数据库出问题的时候，应用也容易
  • 初探Druid连接池之二——慢SQL日志记录 xingsan_zhang 日志连接池druid慢SQL
    由于工作原因，这里先不说连接数据库部分的配置，后面会补上，直接进入慢SQL日志记录。   1.applicationContext.xml中增加如下配置： <bean abstract="true" id="mysql_database" class="com.alibaba.druid.pool.DruidDataSourc
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他