__莫等闲
__莫等闲

原生js图片放大效果

本文参照了作者https://blog.csdn.net/ppfxdj/article/details/92065269修改

效果如下

原生js图片放大效果_第1张图片

点击遮罩层可以关闭图片，或者点击这个按钮，由于时间关系，样式没调过来这个按钮稍微定位一下就可以

废话不多说直接上代码，可兼容小屏幕电脑或手机

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>图片放大</title>
		<meta name="keywords" content="" />
		<meta name="description" content="" />  
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<style>
			ul,li{margin:0;padding:0;list-style: none}
			#box{
				width:600px;
				height:400px;
				margin:20px auto;
			}
			ul li{
				float: left;
				width:200px;
				height:200px;
			}
			img{
				width:100%;
				height:100%;
			}
			.mark{
				width:100%;
				height:100%; 
				background:#000;
				opacity: 0.8;
				position: fixed;
				top: 0;
				left: 0;
			}
			 /*修改pic的宽高,可调整图片大小*/
			.pic{
				width:80%;
				height:500px; 
				position: fixed;
				left: 10%;
				top: 20%;
			}
			span{
				position: fixed;
				width:20px;
				height:20px;
				left:450px;
				top:50px; 
				background: #fff;
				text-align: center;
			}
		</style>
	</head>
	<div id='box'>
		<ul>
			<!--插入图片-->
			<li><img src="../static/vue-photo-preview/demo/2.jpg" alt=""></li>
			<li><img src="../static/vue-photo-preview/demo/3.jpg" alt=""></li>
			<li><img src="../static/vue-photo-preview/demo/2.jpg" alt=""></li>
			<li><img src="../static/vue-photo-preview/demo/3.jpg" alt=""></li>
			<li><img src="../static/vue-photo-preview/demo/2.jpg" alt=""></li>
			<li><img src="../static/vue-photo-preview/demo/3.jpg" alt=""></li>
		</ul>
		<!-- <div class='mark'></div>
		<img src="../static/vue-photo-preview/demo/3.jpg"  class='pic'>
		<span>X</span> -->
	</div>
	<script>
		var lis=document.getElementsByTagName('li');
		var box=document.getElementById('box');
			//遍历所有的li,单击的是哪个li里的图片src 。
			//	创建div  className='mark' 追加到box
			//	创建img  src          className  追加到box
			//	创建span  innerHTML=X  追加到box
			for(var i=0;i<lis.length;i++){
	
				     lis[i].onclick=function(){
				     	//console.log(this)
				     	var  newDiv=document.createElement('div');				//定义好创建的元素
				     		 newDiv.className='mark';							//创建div的时候class类名为mark
				     		 box.appendChild(newDiv);							//#box下创建div
				     	var  newImg=document.createElement('img');
				     		 newImg.className='pic';
				     		 newImg.src=this.getElementsByTagName('img')[0].src;	//创建img的时候src路径为当前点击的图片
				     		// newImg.src=this.childNodes[0].src;
				     		 box.appendChild(newImg);
				     	var newSpan=document.createElement("span");
				     		newSpan.innerHTML='X';
				     		box.appendChild(newSpan);
	
				     		newSpan.onclick=function(){					//span创建了关闭事件，点击删除以下元素
				     			box.removeChild(newDiv);
				     			box.removeChild(newSpan);
				     			box.removeChild(newImg);
				     		}
							newDiv.onclick = function(){				//div也创建了关闭事件，点击删除以下元素
								box.removeChild(newDiv);
								box.removeChild(newSpan);
								box.removeChild(newImg);
							}
	
				     }
	
			}
	
	
	</script>
	</body>
</html>

以上代码实现了简单的点击图片能够放大的效果，没有其它的效果，如有逻辑不清晰，或者有更好的实现方法可以加我扣1344160559一起探讨。

你可能感兴趣的:(原生js图片放大效果)

  • WPF-自定义瀑布流面板 小白tow WPF
    效果子控件的宽度全部一样，新增的子控件会追加到当前最矮的列最下方。源码WaterfallPanel.csusingSystem.Linq;usingSystem.Windows;usingSystem.Windows.Controls;namespaceWeChatInteract.CustomControls{//////瀑布流布局，等列宽///publicclassWaterfallPanel
  • 用Python写了一个好玩的桌面宠物游戏脚本，简单又好玩 墨鱼爆蛋 PythonPython游戏python开发语言游戏桌面宠物
    今天，我们来分享一个宠物桌面小程序，全程都是通过PyQT来制作的，对于PythonGUI感兴趣的朋友，千万不要错过哦！我们先来看看最终的效果，对于一个小小的娱乐项目来说，还是不错啦！好了，废话不多说，我直接上干货，本项目使用PYQT5作为编码框架，如果你对于该框架不是特别熟悉的话，建议先去简单学习一下~源码和素材图片在文末领取！素材图片项目源码展示importsysimportosimportra
  • 【Python百日进阶-Web开发-Feffery】Day604 - 趣味dash_04：Excel转Pdf文件 岳涛@泰山医院 Dashpythonexcel前端dash
    文章目录一、环境准备1.1初始化基础`Python+Dash`环境1.2本例中使用的第三方包二、本项目B站视频讲解三、页面效果四、项目源码一、环境准备1.1初始化基础Python+Dash环境CSDN文档参见：https://blog.csdn.net/yuetaope/article/details/129795264Bilibili视频参见：https://www.bilibili.com/v
  • 在Vue页面中实现平滑滚动功能 种花的人_ 前端vue
    这是一个实现平滑滚动的函数，可以让页面在滚动到指定位置时产生缓动效果该函数依赖于Math.easeInOutQuad函数和requestAnimFrame函数，其中Math.easeInOutQuad函数用于计算当前滚动位置的值（根据时间、起始值、变化量和持续时间），requestAnimFrame函数用于实现动画效果。函数的参数包括：to:目标滚动位置；duration:滚动持续时间，默认为50
  • 【代码】PPARCHP1，批量给SAP生产订单打上删除标识，提高月结时工单结算效率 saplakes #SAP_ABAPABAPSAPPPARCHP1生产订单批量删除标识
    文章目录前言一、PPARCHP1二、PPARCHP1代码三、权限检查四、效果前言SAP系统的生产订单产生的数量太多之后，会导致SAP月结时生产订单结算时的工单结算比较缓慢。因此以原代码拷贝出来，加上了权限检查、创建事务码，并分配给财务会计来定期运行，提高月结效率。一、PPARCHP1程序是PPARCHP1二、PPARCHP1代码REPORTpparchp1.*-------------------
  • 【玩转全栈】----基于ModelForm完成用户管理页面 Edward-tan 全栈开发djangomysqlpython
    目录大致效果添加用户代码引入ModelFormModelForm与一般表单的区别：ModelForm与传统Form的区别：使用ModelForm制作用户管理新建用户编辑用户：删除数据完整代码在学完前面的部门管理案例后，自己独立写出个用户管理应该不难，基本逻辑和大致代码都和前面一样，大家可以自己试试。大致效果基于ModelForm用户管理系统添加用户代码但是，按照之前的方式写的话，在表单方面还是会有
  • ⭐️Python烟花代码 Python老吕 python烟花代码Python烟花代码动态免费Python烟花代码高级Python烟花代码动态高级烟花代码编程Python满屏Python海龟绘图画烟花用Python写一个烟花代码
    python烟花代码Python烟花代码matplotlib实现烟花代码pygame实现烟花代码一pygame实现烟花代码二Python烟花代码在Python中，我们可以通过各种库来模拟烟花的动画效果。虽然Python本身并不是为图形动画设计的语言，但我们可以利用像matplotlib或pygame这样的库来创建一些有趣的可视化效果。matplotlib实现烟花代码首先，确保你已经安装了matpl
  • TRELLIS文本或图像生3d模型一键整合包win版本，省去繁琐安装、效果超Wonder3D，对硬件要求更低速度更快16g N卡可流畅运行 struggle2025 计算机视觉人工智能深度学习图像处理集成学习AI作画
    一、介绍:TRELLIS文生、图生3d模型软件介绍，目前只开放了图生3D（文末提供整合包下载）TRELLIS是一个大型3D资产生成模型。它接受文本或图像提示，并生成各种格式的高质量3D资产，如辐射场、3D高斯和网格。TRELLIS的基石是一种统一的结构化LATent（SLAT）表示法，允许解码到不同的输出格式，以及为SLAT定制的校正流变换器作为强大的后端。我们提供大规模预训练模型，参数高达20亿
  • 你需要知道的快速调整台式电脑显示器亮度的两种方法 简鹿办公 电脑硬件电脑显示器亮度调整如何调整显示器亮度调整屏幕亮度方法
    本教程中简鹿办公将引导您掌握如何轻松且有效地调整台式电脑显示器的亮度设置，无论是直接操作显示器上的物理按键，还是利用英伟达显卡提供的高级色彩和亮度控制选项。无论您是追求极致视觉效果的游戏爱好者，还是需要长时间面对屏幕的专业人士，学会正确调整亮度都将为您的使用体验带来显著提升。一、通过显示器本身调整亮度物理按钮/触摸按键大多数显示器都配备了一组用于调整设置的物理按钮或触摸按键。这些通常位于显示器的底
  • 用Python生成新春烟花效果：实现与解析 一休哥助手 pygamepython开发语言
    引言新春佳节到来之际，烟花的璀璨绽放象征着喜庆和热闹。如果能通过代码在屏幕上生成烟花效果，既能增加节日的趣味，也能加深对编程的理解。本篇博客将详细介绍如何使用Python生成新春烟花效果，包括实现原理、代码解析以及常见问题的解决方案，帮助读者在实践中体验编程的乐趣。一、烟花效果的基本原理烟花效果的实现需要模拟以下几个关键过程：烟花发射：模拟烟花从底部发射到空中的过程。爆炸中心：烟花到达顶点后形成爆
  • vue - 实现省市区的级联选择 紫菀檀ss vuejsjavascriptvue.js
      最近要实现一个省市区级联选择效果，省市区的数据都是使用的本地数据，实现起来逻辑会有一点复杂，我在这里列举PC端的总结分享一下，移动端的代码也是差不多的，除了html之外，其它的可以复制根据需求使用即可。希望对大家有所帮助。一、效果图  PC端的效果图：  移动端的效果图：二、实现逻辑  我这里的实现逻辑是先通过省份来获取城市，然后通过城市来获取区县，街道因为不是固定的，所以让用户自己输入。获取
  • Linux---LNMP动态网站平台 WillianmsLee linuxnginx
    1.部署LNMP环境:1.1–原理目前的网站一般都会有动态和静态数据，默认nginx仅可以处理静态数据，用户访问任何数据都是直接返回对应的文件，如果如果访问的是一个脚本的话，就会导致直接返回一个脚本给用户，而用户没有脚本解释器，也看不懂脚本源代码！因此需要整合LNMP（Linux、Nginx、MySQL、PHP）实现动态网站效果。1.2–一些介绍LNMP在CentOS系统中，源码安装Nginx，使
  • 使用Spring Actuator + Micrometer + Prometheus + Grafana监控Spring Boot应用程序 帅过驴的袋鼠 javadocker
    前言读取本文需要的知识：Java,Docker基本命令当某个应用在生产环境中运行时,监控其运行状态是必要的和明智的。通过实时了解应用程序的运行状况,你能在问题出现之前得到警告,也可以在客户端注意到问题之前解决问题。最终的效果图模块简单介绍SpringActuator:在应用程序离提供众多Web接口,通过它们了解应用运行时的内部状况。Micrometer:为Java平台上的性能数据收集提供了一个通用
  • Element-plus封装表格Validate 努力搬砖的宣 vue.js前端javascriptelementui
    Element-plus实现表格内的表单验证：useAttrValidateHook在Vue.js项目中，表单验证是一个常见的需求，尤其在处理复杂表格编辑场景时。本文将详细介绍一个基于Vue3的自定义Hook——useAttrValidate，它提供了一种便捷的方式来处理表格组件中的字段校验。效果如下：1.导入与初始化Javascriptimport{reactive,nextTick}from"
  • Cesium 无人机航线规划（航点航线） 白嫖叫上我 Cesium无人机cesium
    航线规划实现定制航线，一键巡检功能小镜头模拟的是此方向的拍照效果，觉得合适可以打个拍照印记设置里可调控参数------------------------------------------------------2025-01-10--------------------------------------------------------改进了一下，加入多个动作组，可设置每个航点的动作动作组
  • 模型压缩与优化技术——神经架构搜索（Neural Architecture Search, NAS） DuHz 轻量化模型机器学习计算机视觉人工智能神经网络深度学习数据挖掘语音识别
    模型压缩与优化技术中的神经架构搜索（NeuralArchitectureSearch,NAS）技术1.引言在深度学习领域，神经网络的架构设计对模型的性能至关重要。传统的手动设计网络架构的过程费时费力，且通常依赖于经验和直觉。为了提升效率与效果，神经架构搜索（NeuralArchitectureSearch,NAS）作为一种自动化的方法，能够通过算法寻找和优化最佳的神经网络架构。NAS可以在图像识别
  • SGLang安装教程，部署你的大模型，性能比vllm好，实现张量并行，数据并行，加快推理速度，亲测效果好。 张登杰踩 人工智能结对编程python
    目前大模型部署工具主要是vllm，最近出现了SGLang，很多新开源大模型都支持SGLang的部署推理，例如deepseek-R1，Qwen2.5，Mistral，GLM-4，MiniCPM3，InternLM2，Llama3.2等。代码：GitHub-sgl-project/sglang:SGLangisafastservingframeworkforlargelanguagemodelsand
  • 毕设分享 深度学习街道行人流量计数系统 fawubio_A 毕业设计python毕设
    文章目录0前言1项目运行效果2设计概要2原理介绍2.1目标检测概况什么是目标检测？发展阶段2.2行人检测行人检测简介行人检测技术难点行人检测实现效果4最后0前言这两年开始毕业设计和毕业答辩的要求和难度不断提升，传统的毕设题目缺少创新和亮点，往往达不到毕业答辩的要求，这两年不断有学弟学妹告诉学长自己做的项目系统达不到老师的要求。为了大家能够顺利以及最少的精力通过毕设，学长分享优质毕业设计项目，今天要
  • 视频的上传，转码与展示的过程 小子武 java视频上传视频转码
    本文是记录自己学习过程的，不适合直接拿来用的业务需求及场景后台基于springboot的微服务框架，页面是vue用户可以选择一个视频上传的管理页面，新增时，用户可以选择上传封面图片或者不选择上传封面图片（此时要根据视频的格式决定是从视频中截图或者展示默认图片）页面效果先不展示了，涉及的信息比较多这里贴的是视频转码功能部分，我从网上找的代码又根据自己的需要又改的，很佩服写这段代码的人真的很厉害（侵删
  • ArkUI原生页面滑动性能分析优化实践 harmonyos
    课程简介本课程是【HarmonyOSTechTalk】的第20课。本次交流核心为ArkUI原生页面的滑动性能相关内容。从HarmonyOS渲染原理切入，这是理解页面呈现与滑动效果的根基。深入剖析应用滑动性能问题的分析思路，为开发者提供排查问题的有效方法。详细阐述针对典型性能问题的优化手段，涵盖代码优化、资源管理等多方面。开发者通过此次交流，能够精准把握ArkUI原生页面滑动性能的关键要点，提升性能
  • 构建灵活高效的消息推送能力 harmonyos
    课程简介本课程是【HarmonyOS主题课：HarmonyOSSDK开放能力】的第3课。本课程聚焦于构建灵活高效的消息推送能力。首先引导开发者认识并开通推送服务，为后续推送工作奠定基础。深入讲解推送通知消息，让开发者掌握其有效应用。详细解析推送卡片刷新消息与推送通知扩展消息，助力拓展推送功能的多样性与深度。同时，对推送实况窗消息进行剖析，使开发者能充分利用这一形式增强信息传递效果。通过本课程学习，
  • WPF快速入门3——XAML对象属性赋值 阿卡蒂奥 WPFWPF
    对象属性赋值1、Attribute=Value形式优点：赋值方便。缺点：Value为字符串，但是对象属性未必是字符串，因此无法赋太复杂的值。示例：绘制一个矩形，填充颜色并设置圆角；绘制一个路径，将路径闭合并填充颜色；效果如图所示：2、属性标签优点：可以为对象属性赋较为复杂的值。缺点：程序量大（因此在允许条件下可部分采用Attribute=Value形式，或使用属性默认值）。示例：在按钮对象上绘制一
  • Kotlin Bytedeco OpenCV 图像图像49 仿射变换 图像裁剪 深色風信子 kotlinopencv仿射变换图像裁剪bytedecojavacpp
    KotlinBytedecoOpenCV图像图像49仿射变换图像裁剪1添加依赖2测试代码3测试结果在OpenCV中，仿射变换（AffineTransformation）和透视变换（PerspectiveTransformation）是两种常用的图像几何变换方法。变换方法适用场景仿射变换简单的几何变换（平移、旋转、缩放、剪切）。透视变换改变图像视角和模拟3D投影效果。变换方法解释特点应用场景实现方法
  • 机器学习-分类算法评估标准 赛丽曼 机器学习机器学习分类人工智能
    一.准确率accuracy将预测结果和测试集的目标值比较，计算预测正确的百分比准确率越高说明模型效果越好fromsklearnimportdatasetsfromsklearn.model_selectionimporttrain_test_splitfromsklearn.neighborsimportKNeighborsClassifier#加载鸢尾花数据X,y=datasets.load_i
  • HMI设计十-cybertruck-QPainter径向渐变圆与阴影流动设计 william_myq HMIQTUIQPainter
    如何构建图示点阵背景可以参考本栏同刊HMI设计九-cybertruck-QPainter复杂油门刹车滑动块设计-CSDN博客本文目标如何构建QPainter阴影流动设计如何构建径向渐变阴影圆如何营造阴影流动效果如何构建径向渐变阴影圆使用ShapePath中的PathArc构建两个半圆组成一个圆用fillGradient来使能相应的渐变效果，可以支持线性，径向渐变//Circle.qml定义一个圆形
  • mysql内外三种连接,MySQL内连接和外连接 LiuYanagi mysql内外三种连接
    INNERJOIN(内连接,或等值连接)：获取两个表中字段匹配关系的记录。LEFTJOIN(左连接)：获取左表所有记录，即使右表没有对应匹配的记录。RIGHTJOIN(右连接)：与LEFTJOIN相反，用于获取右表所有记录，即使左表没有对应匹配的记录。MySQL内连接(innerjoinon)MySQL的内连接使用innerjoinon,它的效果跟使用where是一样的,如果联结的是两个表,那么需
  • 基于MRS-Hudi构建数据湖的典型应用场景介绍 华为云技术精粹 云计算华为云
    一、传统数据湖存在的问题与挑战传统数据湖解决方案中，常用Hive来构建T+1级别的数据仓库，通过HDFS存储实现海量数据的存储与水平扩容，通过Hive实现元数据的管理以及数据操作的SQL化。虽然能够在海量批处理场景中取得不错的效果，但依然存在如下现状问题：问题一：不支持事务由于传统大数据方案不支持事务，有可能会读到未写完成的数据，造成数据统计错误。为了规避该问题，通常控制读写任务顺序调用，在保证写
  • 重建大师倾斜高斯泼溅技术（OPGS）重建出来的模型是什么格式？ 大势智慧 实景三维一问一答重建大师三维模型倾斜影像OPGS高斯泼溅
    重建大师OPGS重建出来的模型是ply格式，三维高斯球体渲染的3D效果。重建大师是一款专为超大规模实景三维数据生产设计的集群并行处理软件，支持卫星影像、航空影像、倾斜影像和激光点云多源数据输入建模，可完成超大规模数据的空三解算、自动三维建模，输出高精度彩色网格模型。重建大师已更新7.0版本，如需请添加Das小助理获取，欢迎大家下载！
  • 初学python爬虫，爬取“豆瓣电影 Top 250”相关信息，并下载电影封面 ~柠月如风~ Python爬虫python爬虫正则表达式
    文章目录注：一、爬取“豆瓣电影Top250”相关信息：1、准备工作2、获取数据补充：urllib3、标签解析补充：BeautifulSoup4和re4、保存数据补充：xlwt附：爬取“豆瓣电影Top250”相关信息的完整代码：二、爬取/下载top250电影对应的封面效果展示附：下载电影封面的完整代码：注：所学的视频教程：B站Python爬虫基础5天速成（2021全新合集）Python入门+数据可视
  • Python 初始化方法 钢铁男儿 Python
    1、初始化方法1.1之前代码存在的问题----在类的外部给对象增加属性将案例代码进行调整，先调用方法再设置属性，观察一下执行效果。提示：在日常开发中，不推荐在类的外部给对象增加属性；如果在运行时，没有找到属性，程序会报错；对象应该包含有哪些属性，应该封装在类的内部；1.2初始化方法当使用**类名（）**创建对象时，会自动执行以下操作：1）、为对象在内存中分配空间—创建对象；2）、为对象的属性设置初
  • PHP如何实现二维数组排序？ IT独行者 二维数组PHP排序　
    二维数组在PHP开发中经常遇到，但是他的排序就不如一维数组那样用内置函数来的方便了，（一维数组排序可以参考本站另一篇文章【PHP中数组排序函数详解汇总】）。二维数组的排序需要我们自己写函数处理了，这里UncleToo给大家分享一个PHP二维数组排序的函数： 代码： functionarray_sort($arr,$keys,$type='asc'){ $keysvalue= $new_arr
  • 【Hadoop十七】HDFS HA配置 bit1129 hadoop
    基于Zookeeper的HDFS HA配置主要涉及两个文件,core-site和hdfs-site.xml。   测试环境有三台 hadoop.master hadoop.slave1 hadoop.slave2   hadoop.master包含的组件NameNode, JournalNode, Zookeeper，DFSZKFailoverController
  • 由wsdl生成的java vo类不适合做普通java vo darrenzhu VOwsdlwebservicerpc
    开发java webservice项目时，如果我们通过SOAP协议来输入输出，我们会利用工具从wsdl文件生成webservice的client端类，但是这里面生成的java data model类却不适合做为项目中的普通java vo类来使用，当然有一中情况例外，如果这个自动生成的类里面的properties都是基本数据类型，就没问题，但是如果有集合类，就不行。原因如下： 1)使用了集合如Li
  • JAVA海量数据处理之二（BitMap） 周凡杨 java算法bitmapbitset数据
           路漫漫其修远兮，吾将上下而求索。想要更快，就要深入挖掘 JAVA 基础的数据结构，从来分析出所编写的 JAVA 代码为什么把内存耗尽，思考有什么办法可以节省内存呢？ 啊哈！算法。这里采用了 BitMap 思想。   首先来看一个实验： 指定 VM 参数大小： -Xms256m -Xmx540m
  • java类型与数据库类型 g21121 java
    很多时候我们用hibernate的时候往往并不是十分关心数据库类型和java类型的对应关心，因为大多数hbm文件是自动生成的，但有些时候诸如：数据库设计、没有生成工具、使用原始JDBC、使用mybatis(ibatIS)等等情况，就会手动的去对应数据库与java的数据类型关心，当然比较简单的数据类型即使配置错了也会很快发现问题，但有些数据类型却并不是十分常见，这就给程序员带来了很多麻烦。 &nb
  • Linux命令 510888780 linux命令
    系统信息 arch 显示机器的处理器架构(1) uname -m 显示机器的处理器架构(2) uname -r 显示正在使用的内核版本 dmidecode -q 显示硬件系统部件 - (SMBIOS / DMI) hdparm -i /dev/hda 罗列一个磁盘的架构特性 hdparm -tT /dev/sda 在磁盘上执行测试性读取操作 cat /proc/cpuinfo 显示C
  • java常用JVM参数 墙头上一根草 javajvm参数
    -Xms：初始堆大小，默认为物理内存的1/64(<1GB)；默认(MinHeapFreeRatio参数可以调整)空余堆内存小于40%时，JVM就会增大堆直到-Xmx的最大限制 -Xmx：最大堆大小，默认(MaxHeapFreeRatio参数可以调整)空余堆内存大于70%时，JVM会减少堆直到 -Xms的最小限制 -Xmn：新生代的内存空间大小，注意：此处的大小是（eden+ 2
  • 我的spring学习笔记9-Spring使用工厂方法实例化Bean的注意点 aijuans Spring 3
    方法一： <bean id="musicBox" class="onlyfun.caterpillar.factory.MusicBoxFactory" factory-method="createMusicBoxStatic"></bean> 方法二：
  • mysql查询性能优化之二 annan211 UNIONmysql查询优化索引优化
    1 union的限制 有时mysql无法将限制条件从外层下推到内层，这使得原本能够限制部分返回结果的条件无法应用到内层 查询的优化上。 如果希望union的各个子句能够根据limit只取部分结果集，或者希望能够先排好序在 合并结果集的话，就需要在union的各个子句中分别使用这些子句。 例如 想将两个子查询结果联合起来，然后再取前20条记录，那么mys
  • 数据的备份与恢复 百合不是茶 oraclesql数据恢复数据备份
     数据的备份与恢复的方式有: 表,方案 ,数据库;     数据的备份: 导出到的常见命令; 参数 说明 USERID 确定执行导出实用程序的用户名和口令 BUFFER 确定导出数据时所使用的缓冲区大小，其大小用字节表示 FILE 指定导出的二进制文
  • 线程组 bijian1013 java多线程threadjava多线程线程组
    有些程序包含了相当数量的线程。这时，如果按照线程的功能将他们分成不同的类别将很有用。        线程组可以用来同时对一组线程进行操作。        创建线程组：ThreadGroup g = new ThreadGroup(groupName);  &nbs
  • top命令找到占用CPU最高的java线程 bijian1013 javalinuxtop
    上次分析系统中占用CPU高的问题，得到一些使用Java自身调试工具的经验，与大家分享。 (1)使用top命令找出占用cpu最高的JAVA进程PID:28174 (2)如下命令找出占用cpu最高的线程 top -Hp 28174 -d 1 -n 1 32694 root 20 0 3249m 2.0g 11m S 2 6.4 3:31.12 java
  • 【持久化框架MyBatis3四】MyBatis3一对一关联查询 bit1129 Mybatis3
      当两个实体具有1对1的对应关系时，可以使用One-To-One的进行映射关联查询   One-To-One示例数据 以学生表Student和地址信息表为例，每个学生都有都有1个唯一的地址(现实中，这种对应关系是不合适的，因为人和地址是多对一的关系)，这里只是演示目的   学生表   CREATE TABLE STUDENTS (
  • C/C++图片或文件的读写 bitcarter 写图片
    先看代码： /*strTmpResult是文件或图片字符串 * filePath文件需要写入的地址或路径 */ int writeFile(std::string &strTmpResult,std::string &filePath) { int i,len = strTmpResult.length(); unsigned cha
  • nginx自定义指定加载配置 ronin47
    进入 /usr/local/nginx/conf/include 目录，创建 nginx.node.conf 文件，在里面输入如下代码： upstream nodejs { server 127.0.0.1:3000; #server 127.0.0.1:3001; keepalive 64; } server { liste
  • java-71-数值的整数次方.实现函数double Power(double base, int exponent)，求base的exponent次方 bylijinnan double
    public class Power { /** *Q71-数值的整数次方 *实现函数double Power(double base, int exponent)，求base的exponent次方。不需要考虑溢出。 */ private static boolean InvalidInput=false; public static void main(
  • Android四大组件的理解 Cb123456 android四大组件的理解
     分享一下，今天在Android开发文档-开发者指南中看到的:                            App components are the essential building blocks of an Android
  • [宇宙与计算]涡旋场计算与拓扑分析 comsci 计算
         怎么阐述我这个理论呢？ 。。。。。。。。。       首先： 宇宙是一个非线性的拓扑结构与涡旋轨道时空的统一体。。。。       我们要在宇宙中寻找到一个适合人类居住的行星，时间非常重要，早一个刻度和晚一个刻度，这颗行星的
  • 同一个Tomcat不同Web应用之间共享会话Session cwqcwqmax9 session
    实现两个WEB之间通过session 共享数据 查看tomcat 关于 HTTP Connector 中有个emptySessionPath 其解释如下： If set to true, all paths for session cookies will be set to /. This can be useful for portlet specification impleme
  • springmvc Spring3 MVC，ajax，乱码 dashuaifu springjquerymvcAjax
      springmvc Spring3 MVC @ResponseBody返回，jquery ajax调用中文乱码问题解决   Spring3.0 MVC @ResponseBody 的作用是把返回值直接写到HTTP response body里。具体实现AnnotationMethodHandlerAdapter类handleResponseBody方法，具体实
  • 搭建WAMP环境 dcj3sjt126com wamp
    这里先解释一下WAMP是什么意思。W:windows，A：Apache，M：MYSQL，P：PHP。也就是说本文说明的是在windows系统下搭建以apache做服务器、MYSQL为数据库的PHP开发环境。      工欲善其事，必须先利其器。因为笔者的系统是WinXP，所以下文指的系统均为此系统。笔者所使用的Apache版本为apache_2.2.11-
  • yii2 使用raw http request dcj3sjt126com http
    Parses a raw HTTP request using yii\helpers\Json::decode()   To enable parsing for JSON requests you can configure yii\web\Request::$parsers using this class: 'request' =&g
  • Quartz-1.8.6 理论部分 eksliang quartz
    转载请出自出处：http://eksliang.iteye.com/blog/2207691 一.概述 基于Quartz-1.8.6进行学习，因为Quartz2.0以后的API发生的非常大的变化，统一采用了build模式进行构建； 什么是quartz?   答：简单的说他是一个开源的java作业调度框架，为在 Java 应用程序中进行作业调度提供了简单却强大的机制。并且还能和Sp
  • 什么是POJO？ gupeng_ie javaPOJO框架Hibernate
    POJO--Plain Old Java Objects(简单的java对象)   POJO是一个简单的、正规Java对象，它不包含业务逻辑处理或持久化逻辑等，也不是JavaBean、EntityBean等，不具有任何特殊角色和不继承或不实现任何其它Java框架的类或接口。   POJO对象有时也被称为Data对象，大量应用于表现现实中的对象。如果项目中使用了Hiber
  • jQuery网站顶部定时折叠广告 ini JavaScripthtmljqueryWebcss
    效果体验：http://hovertree.com/texiao/jquery/4.htmHTML文件代码： <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>网页顶部定时收起广告jQuery特效 - HoverTree<
  • Spring boot内嵌的tomcat启动失败 kane_xie spring boot
    根据这篇guide创建了一个简单的spring boot应用，能运行且成功的访问。但移植到现有项目（基于hbase）中的时候，却报出以下错误：     SEVERE: A child container failed during start java.util.concurrent.ExecutionException: org.apache.catalina.Lif
  • leetcode: sort list michelle_0916 Algorithmlinked listsort
    Sort a linked list in O(n log n) time using constant space complexity. ====analysis======= mergeSort for singly-linked list  ====code=======   /** * Definition for sin
  • nginx的安装与配置,中途遇到问题的解决 qifeifei nginx
    我使用的是ubuntu13.04系统，在安装nginx的时候遇到如下几个问题，然后找思路解决的，nginx 的下载与安装   wget http://nginx.org/download/nginx-1.0.11.tar.gz tar zxvf nginx-1.0.11.tar.gz ./configure make make install   安装的时候出现
  • 用枚举来处理java自定义异常 tcrct javaenumexception
    在系统开发过程中，总少不免要自己处理一些异常信息，然后将异常信息变成友好的提示返回到客户端的这样一个过程，之前都是new一个自定义的异常，当然这个所谓的自定义异常也是继承RuntimeException的，但这样往往会造成异常信息说明不一致的情况，所以就想到了用枚举来解决的办法。 1，先创建一个接口，里面有两个方法，一个是getCode, 一个是getMessage public
  • erlang supervisor分析 wudixiaotie erlang
    当我们给supervisor指定需要创建的子进程的时候，会指定M,F,A,如果是simple_one_for_one的策略的话，启动子进程的方式是supervisor:start_child(SupName, OtherArgs),这种方式可以根据调用者的需求传不同的参数给需要启动的子进程的方法。和最初的参数合并成一个数组，A ++ OtherArgs。那么这个时候就有个问题了，既然参数不一致，那
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他