qq_38902844
qq_38902844

带你亲手实现网页轮播图!!! 这感觉完美!!!

效果图

静态的

带你亲手实现网页轮播图!!! 这感觉完美!!!_第1张图片

动态的

图片素材

带你亲手实现网页轮播图!!! 这感觉完美!!!_第2张图片

带你亲手实现网页轮播图!!! 这感觉完美!!!_第3张图片带你亲手实现网页轮播图!!! 这感觉完美!!!_第4张图片带你亲手实现网页轮播图!!! 这感觉完美!!!_第5张图片

图片素材取自小米官网

说明

  • HTML/CSS/JS代码分别保存在index.html/index.css/index.js 文件，而index.css和index.js文件又分别保存在 css 和 js 文件夹下
  • 图片素材依次命名为：pic_01.jpg pic_02.jpg 等等，所有图片都保存在 img 文件夹中
  • 示意图如下
    带你亲手实现网页轮播图!!! 这感觉完美!!!_第6张图片

源代码

HTML代码


<html>
	<head>
		<meta charset="utf-8" />
		<title>轮播图title>
		
		<link rel="stylesheet" href="css/index.css" />
	head>
	
	<body>
		<div class="wrap">
			<ul class="list">
				<li class="item active"><img src="img/pic_01.jpg" alt="" />li>
				<li class="item"><img src="img/pic_02.jpg" alt="" />li>
				<li class="item"><img src="img/pic_03.jpg" alt="" />li>
				<li class="item"><img src="img/pic_04.jpg" alt="" />li>
			ul>
			<button class="btn" id="pre"><button>
			<button class="btn" id="next">>button>
			<ul class="point_list">
				
				<li tab_index="0" class="point active">li>
				<li tab_index="1" class="point">li>
				<li tab_index="2" class="point">li>
				<li tab_index="3" class="point">li>
			ul>
		div>
		
		<script src="js/index.js" type="text/javascript">script>
	body>
html>

CSS代码

*{
	margin: 0;
	padding: 0;
}


.wrap{
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	
	width: 1226px;
	height: 460px;
	margin-top: 20px;
}
ul{
	list-style: none;
	position: absolute;
	top: 0;
	left: 0;
	width: 1226px;
	height: 460px;
	
}

img{
	width: 1226px;
	height: 460px;
}
.item{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	opacity: 0;
	transition: 0.5s;
}
/*被激活的图片，放置到最上面*/
.item.active{
	z-index: 666;
	opacity: 1;
}

.point_list{
	position: absolute;
	left: 580px;
	top: 430px;
	z-index: 999;
}
.point{
	float: left;
	width: 8px;
	height: 8px;
	margin-right: 8px;
	border-radius: 50%;
	background: rgba(0,0,0,0.5);
	border: 2px solid rgba(255,255,255,0.6);
	/* background: pink; */
}
.point.active , .point:hover{
	background: rgba(255,255,255,0.8);
	border: 2px solid rgba(0,0,0,0.4);
}

.btn{
	width: 40px;
	height: 70px;
	/* 垂直居中 */
	position: absolute;
	top: 50%;
	margin-top: -35px;
	left: 0;
	z-index: 999;
	border: none;
	outline: none;
	font-size: 28px;
	color: #333;
	background: none;
}
.btn:hover{
	background: rgba(0,0,0,0.5);
	color: #fff;
}

#pre{
	
}
/*下一张*/
#next{
	left: 100%;
	margin-left: -40px;
}

JS代码

// 获取所有图片
var items = document.getElementsByClassName("item");
// 获取所有圆点
var points = document.getElementsByClassName("point");
// 获取按钮
var pre = document.getElementById("pre");
var next = document.getElementById("next");

var index = 0;
var time = 0;

// 点击上一页
pre.onclick = function(){
	items[index].className = "item";
	points[index].className = "point";
	if(index <= 0){
		index = items.length;
	}
	
	index--;
	items[index].className = "item active";
	points[index].className = "point active";
}

// 点击下一页
next.onclick = function(){
	points[index].className = "point";
	items[index].className = "item";
	index++;
	index = index % items.length;
	
	items[index].className = "item active";
	points[index].className = "point active";
}

for(var i=0; i<points.length; i++){
	points[i].onclick = function(){
		points[index].className = "point";
		items[index].className = "item";
		
		index = Number(this.getAttribute("tab_index"));
		
		items[index].className = "item active";
		points[index].className = "point active";
		
		time = 0;
	}
}

setInterval(function(){
	
	if(time >= 30){
		next.onclick();
		time = 0;
	}else{
		time++;
	}
},100);

你可能感兴趣的:(带你亲手实现网页轮播图!!! 这感觉完美!!!)

  • 芦花鞋一四 许叶晗
    又是在一个寒冷的夏日里，青铜和葵花决定今天一起去卖芦花鞋，奶奶亲手给他们做了一碗热乎乎的粥对他们说:“就靠你们两挣生活费了这碗粥赶紧趁热喝了吧！”于是青铜和葵花喝完了奶奶给她们做的粥，就准备去镇上卖卢花鞋，这回青铜和葵花穿着新的芦花鞋来到了镇上。青铜这回看到了很多人都在卖，用手势表达对葵花说:“这回有好多人在抢我们生意呢！我们必须得吆喝起来。”葵花点了点头。可是谁知他们也大声的叫，卖芦花喽！卖芦花
  • 随笔 | 仙一般的灵气 海思沧海
    仙岛今天，我看了你全部，似乎已经进入你的世界我不知道，这是否是梦幻，还是你仙一般的灵气吸引了我也许每一个人都要有一份属于自己的追求，这样才能够符合人生的梦想，生活才能够充满着阳光与快乐我不知道，我为什么会这样的感叹，是在感叹自己的人生，还是感叹自己一直没有孜孜不倦的追求只感觉虚度了光阴，每天活在自己的梦中，活在一个不真实的世界是在逃避自己，还是在逃避周围的一切有时候我嘲笑自己，嘲笑自己如此的虚无，
  • 想家 爆米花机
    也许不同于大家对家乡的思念，我对家乡甚至是疯狂的不舍。还未踏出车站就感觉到幸福，我享受这里的夕阳、这里的浓烈柴火味、这里每一口家常菜。我是宅女，我贪恋家的安逸。刚刚踏出大学校门，初出茅庐，无法适应每年只能国庆和春节回家。我焦虑、失眠、无端发脾气，是无法适应工作的节奏，是无法接受我将一步步离开家乡的事实。我不想承认自己胸无大志，选择再次踏上征程。图片发自App
  • 一百九十四章. 自相矛盾 巨木擎天
    唉！就这么一夜，林子感觉就像过了很多天似的，先是回了阳间家里，遇到了那么多不可思议的事情儿。特别是小伙伴们，第二次与自己见面时，僵硬的表情和恐怖的气氛，让自己如坐针毡，打从心眼里难受！还有东子，他现在还好吗？有没有被人欺负？护城河里的小鱼小虾们，还都在吗？水不会真的干枯了吧？那对相亲相爱漂亮的太平鸟儿，还好吧！春天了，到了做窝、下蛋、喂养小鸟宝宝的时候了，希望它们都能够平安啊！虽然没有看见家人，也
  • element实现动态路由+面包屑 软件技术NINI vue案例vue.js前端
    el-breadcrumb是ElementUI组件库中的一个面包屑导航组件，它用于显示当前页面的路径，帮助用户快速理解和导航到应用的各个部分。在Vue.js项目中，如果你已经安装了ElementUI，就可以很方便地使用el-breadcrumb组件。以下是一个基本的使用示例：安装ElementUI（如果你还没有安装的话）:你可以通过npm或yarn来安装ElementUI。bash复制代码npmi
  • 10月|愿你的青春不负梦想-读书笔记-01 Tracy的小书斋
    本书的作者是俞敏洪，大家都很熟悉他了吧。俞敏洪老师是我行业的领头羊吧，也是我事业上的偶像。本日摘录他书中第一章中的金句：『一个人如果什么目标都没有，就会浑浑噩噩，感觉生命中缺少能量。能给我们能量的，是对未来的期待。第一件事，我始终为了进步而努力。与其追寻全世界的骏马，不如种植丰美的草原，到时骏马自然会来。第二件事，我始终有阶段性的目标。什么东西能给我能量？答案是对未来的期待。』读到这里的时候，我便
  • 微服务下功能权限与数据权限的设计与实现 nbsaas-boot 微服务java架构
    在微服务架构下，系统的功能权限和数据权限控制显得尤为重要。随着系统规模的扩大和微服务数量的增加，如何保证不同用户和服务之间的访问权限准确、细粒度地控制，成为设计安全策略的关键。本文将讨论如何在微服务体系中设计和实现功能权限与数据权限控制。1.功能权限与数据权限的定义功能权限：指用户或系统角色对特定功能的访问权限。通常是某个用户角色能否执行某个操作，比如查看订单、创建订单、修改用户资料等。数据权限：
  • 2021年12月19日，春蕾教育集团团建活动感受——黄晓丹 黄错错加油
    感受:1.从陌生到熟悉的过程。游戏环节让我们在轻松的氛围中得到了锻炼，也增长了不少知识。2.游戏过程中，我们贡献的是个人力量，展现的是团队的力量。它磨合的往往不止是工作的熟悉，更是观念上契合度的贴近。3.这和工作是一样的道理。在各自的岗位上，每个人摆正自己的位置、各司其职充分发挥才能，并团结一致劲往一处使，才能实现最大的成功。新知:1.团队精神需要不断地创新。过去，人们把创新看作是冒风险，现在人们
  • 《策划经理回忆录之二》 路基雅虎
    话说三年变六年，飘了，飘了……眨眼，2013年5月，老吴回到了他的家乡——油城从新开启他的工作幻想症生涯。很庆幸，这是一家很有追求，同时敢于尝试的，且实力不容低调的新星房企——金源置业(前身泰源置业)更值得庆幸的是第一个盘就是油城十路的标杆之一:金源盛世。2013年5月，到2015年11月，两年的陪伴，迎来了一场大爆发。2000个筹，5万/筹，直接回笼1个亿！！！这……让我开始认真审视这座看似五线
  • 店群合一模式下的社区团购新发展——结合链动 2+1 模式、AI 智能名片与 S2B2C 商城小程序源码 说私域 人工智能小程序
    摘要：本文探讨了店群合一的社区团购平台在当今商业环境中的重要性和优势。通过分析店群合一模式如何将互联网社群与线下终端紧密结合，阐述了链动2+1模式、AI智能名片和S2B2C商城小程序源码在这一模式中的应用价值。这些创新元素的结合为社区团购带来了新的机遇，提升了用户信任感、拓展了营销渠道，并实现了线上线下的完美融合。一、引言随着互联网技术的不断发展，社区团购作为一种新兴的商业模式，在满足消费者日常需
  • 向内而求 陈陈_19b4
    10月27日，阴。阅读书目:《次第花开》。作者:希阿荣博堪布，是当今藏传佛家宁玛派最伟大的上师法王，如意宝晋美彭措仁波切颇具影响力的弟子之一。多年以来，赴海内外各地弘扬佛法，以正式授课、现场开示、发表文章等多种方法指导佛学弟子修行佛法。代表作《寂静之道》、《生命这出戏》、《透过佛法看世界》自出版以来一直是佛教类书籍中的畅销书。图片发自App金句:1.佛陀说，一切痛苦的根源在于我们长期以来对自身及外
  • 消息中间件有哪些常见类型 xmh-sxh-1314 java
    消息中间件根据其设计理念和用途，可以大致分为以下几种常见类型：点对点消息队列（Point-to-PointMessagingQueues）：在这种模型中，消息被发送到特定的队列中，消费者从队列中取出并处理消息。队列中的消息只能被一个消费者消费，消费后即被删除。常见的实现包括IBM的MQSeries、RabbitMQ的部分使用场景等。适用于任务分发、负载均衡等场景。发布/订阅消息模型（Pub/Sub
  • 开心 蒋泳频
    从无比抗拒来上课到接受，感动，收获～看着波哥成长，晶晶幸福笑容满面。感觉自己做的事情很有意义，很开心！还有3个感召目标就是还有三个有缘人，哈哈。明天感召去明日计划：8：30-11：00小公益11：00-21点上班，感召图片发自App图片发自App图片发自App
  • 2018-07-23-催眠日作业-#不一样的31天#-66小鹿 小鹿_33
    预言日：人总是在逃避命运的路上，与之不期而遇。心理学上有个著名的名词，叫做自证预言；经济学上也有一个很著名的定律叫做，墨菲定律；在灵修派上，还有一个很著名的法则，叫做吸引力法则。这3个领域的词，虽然看起来不太一样，但是他们都在告诉人们一个现象：你越担心什么，就越有可能会发生什么。同样的道理，你越想得到什么，就应该要积极地去创造什么。无论是自证预言，墨菲定律还是吸引力法则，对人都有正反2个维度的影响
  • 2022-04-18 Apbenz
    语重心长的和我说，不要老是说不行，人至而立之年危机四伏，内在的，外在的，感觉就是心力憔悴，让人无所适从。面对职场的无情，突然好羡慕干体力劳动的外卖小哥。难道命运是想让我去送外卖了吗？干体力活才能让我活下去？fastadmin打卡成功,淘宝金币任务完成。ㅏㅓㅗㅜㅡㅣㅐㅔㅑㅕㅛㅠㅢㅒㅖY行。야자여자요리우유의사얘기예
  • 腾讯云技术深度探索：构建高效云原生微服务架构 我的运维人生 云原生架构腾讯云运维开发技术共享
    腾讯云技术深度探索：构建高效云原生微服务架构在当今快速发展的技术环境中，云原生技术已成为企业数字化转型的关键驱动力。腾讯云作为行业领先的云服务提供商，不断推出创新的产品和技术，助力企业构建高效、可扩展的云原生微服务架构。本文将深入探讨腾讯云在微服务领域的最新进展，并通过一个实际案例展示如何在腾讯云平台上构建云原生应用。腾讯云微服务架构概览腾讯云微服务架构基于云原生理念，旨在帮助企业快速实现应用的容
  • 情殇——（5）压抑的小木匠放纵了自己。 石疯聊情感故事
    木讷的小木匠，其实只是不苟言笑。其实内心深处也是挣扎着，由于性格内敛，不喜形于色，给人的感觉非常的木讷。其实小木匠情商智商都不低。他为人扎实，非常的务实。他的爱是既深沉又宽容。可是是一个男人，都会对妻子出轨的事儿，不会忘怀！只是压抑在心底，为了某种考量或许是真爱。小木匠对于丽影和别人私奔又重回家庭，表面上并没有，天翻地覆，暴风骤雨，其内心深处也是经历了，痛苦的挣扎。。。再一次酒后，他和一个离家多年
  • Python教程：一文了解使用Python处理XPath 旦莫 Python进阶python开发语言
    目录1.环境准备1.1安装lxml1.2验证安装2.XPath基础2.1什么是XPath？2.2XPath语法2.3示例XML文档3.使用lxml解析XML3.1解析XML文档3.2查看解析结果4.XPath查询4.1基本路径查询4.2使用属性查询4.3查询多个节点5.XPath的高级用法5.1使用逻辑运算符5.2使用函数6.实战案例6.1从网页抓取数据6.1.1安装Requests库6.1.2代
  • 相信相信的力量 孙丽_cdb3
    孙丽中级十期坚持分享第345天有一个特别有哲理的故事：有一只老鹰下了蛋，这个蛋，不知怎的就滚到了鸡窝里去了，鸡也下了一窝蛋，然后鸡妈妈把这些蛋全都浮出来了，孵出来之后等小鸡长大一点了，就觉得鹰蛋孵出来的那只小鹰怪模怪样，这些小鸡都嘲笑它，真难看，真笨，丑死了，那只小鹰觉得自己真是谁也不像，真是不好看，后来鸡妈妈也不喜欢他，我怎么生出你这样的孩子来了？真烦人，后来这群小鸡和小鹰一起生活，有一天，老鹰
  • 从鸡肉高汤到记忆的魔法再到有效提示的艺术 步子哥 人工智能
    还记得小时候那些天马行空的白日梦吗？也许只要按下键盘上的某个神奇组合，电脑就会发出滴滴的声响，一个隐藏的世界突然在你眼前展开，让你获得超凡的能力，摆脱平凡的生活。这听起来像是玩过太多电子游戏的幻想，但实际上，间隔重复系统给人的感觉惊人地相似。在最佳状态下，这些系统就像魔法一样神奇。本文将以一个看似平凡的鸡肉高汤食谱为例，深入浅出地探讨如何编写有效的间隔重复提示，让你像掌握烹饪技巧一样轻松地掌握记忆
  • 今天我破防了 sin信仰
    今天本来是大年初一，新年的第一天，应该是高高兴兴的一天，但是我怎么也高兴不起来。具体原因很简单，原本计划年后去县城找了一份会计的工作，被公公婆婆否定了，我心里立马就不舒服了，但是当时刚好肚子疼，我去了厕所，等我上完厕所，公公由于喝了酒还在那里和婆婆唠叨个没完。然后我就在心情极度压抑的情况下把午饭吃完的碗筷和锅给刷了。边刷碗筷和锅，边在那里难受，感觉自己在这个家里真的是过的憋屈死了，公婆不让我去上班
  • PHP环境搭建详细教程 好看资源平台 前端php
    PHP是一个流行的服务器端脚本语言，广泛用于Web开发。为了使PHP能够在本地或服务器上运行，我们需要搭建一个合适的PHP环境。本教程将结合最新资料，介绍在不同操作系统上搭建PHP开发环境的多种方法，包括Windows、macOS和Linux系统的安装步骤，以及本地和Docker环境的配置。1.PHP环境搭建概述PHP环境的搭建主要分为以下几类：集成开发环境：例如XAMPP、WAMP、MAMP，这
  • 18-115 一切思考不能有效转化为行动，都TM是扯淡！ 成长时间线
    7月25号写了一篇关于为什么会断更如此严重的反思，然而，之后日更仅仅维持了一周，又出现了这次更严重的现象。从8月2号到昨天8月6号，5天！又是5天没有更文！虽然这次断更时间和上次一样，那为什么说这次更严重？因为上次之后就分析了问题的原因，以及应该如何解决，按理说应该会好转，然而，没过几天严重断更的现象再次出现，想想，经过反思，问题依然没有解决与改变，这让我有些担忧。到底是哪里出了问题，难道我就真的
  • 山东大学小树林支教调研团青青仓木队——翟晓楠 山东大学青青仓木队
    过了半年，又一次启程，又一次回到支教的初心之地。比起上一次的试探与不安，我更多了一丝稳重与熟练。心境、处境也都随着半个学期的过去而变得不同，半个学期中，身体上的，心理上的，太多的逆境让我变得步履维艰，曲曲折折，弯弯绕绕，我仿佛打不起精神，没有胃口，没有动力。感觉走的不顺畅的时候，支教这个旅程，给了我力量。自告奋勇承担起队长这一职务的我，从组织时的复杂和困难的经历，协调各种问题，从无到有，和校长和队
  • 【夜读】提升生活品质的8个建议 茳淮秀水
    停止攀比很多人之所以感觉疲惫，部分原因是来自于跟别人攀比。殊不知，攀比得到的满足只是片刻的，过后往往会感到空虚。过分在意别人的评价，丢失的是自己原有的审美，扰乱的是自己最初的节奏。不妨活得洒脱些，自己内心丰盈了，快乐就能更持久。停止自责想改变自己，先从接纳自己开始。越是过分自责，就越难改变现状，因为如果把精力全耗在自责上，就没有精力用来改变了。遇到问题，我们要用正确的心态去面对。与其一味自责，不如
  • 郎朗大婚娶公主：所有光环的背后，都是十年如一日的自律 简小尘
    近日，关于郎朗大婚的新闻上了热搜，看了新娘的照片，既有天使般的面容，更有魔鬼般的身材，关键是人家还身世好，又有才华，这真的是让所有男人羡慕嫉妒恨哪。有些人不禁会想，“凭什么郎朗的人生就象开挂了一样，可我却每天都活得这么狼狈！”其实，每个开挂的人生背后，都是苦行僧般的自律。01欲戴王冠，必承其重。练琴不能只靠兴趣，更需要自律！我们先来看一下朗朗在小时候的作息时间表：早晨5:45起床，练琴1小时。中午
  • 我在意的 Yuexiaofeng
    我所在意的，往往是你最容易忽略的，这让我感到为难。我所感动的，你却无动于衷，这使我感到惭愧。我所做的，你却视而不见，这让我不知如何是好。
  • 拥有断舍离的心态，过精简生活--《断舍离》读书笔记 爱吃丸子的小樱桃
    不知不觉间房间里的东西越来越多，虽然摆放整齐，但也时常会觉得空间逼仄，令人心生烦闷。抱着断舍离的态度，我开始阅读《断舍离》这本书，希望从书中能找到一些有效的方法，帮助我实现空间、物品上的断舍离。《断舍离》是日本作家山下英子通过自己的经历、思考和实践总结而成的，整体内涵也从刚开始的私人生活哲学的“断舍离”升华成了“人生实践哲学”，接着又成为每个人都能实行的“改变人生的断舍离”，从“哲学”逐渐升华成“
  • DIV+CSS+JavaScript技术制作网页（旅游主题网页设计与制作）云南大理 STU学生网页设计 网页设计期末网页作业html静态网页html5期末大作业网页设计web大作业
    ️精彩专栏推荐作者主页:【进入主页—获取更多源码】web前端期末大作业：【HTML5网页期末作业(1000套)】程序员有趣的告白方式：【HTML七夕情人节表白网页制作(110套)】文章目录二、网站介绍三、网站效果▶️1.视频演示2.图片演示四、网站代码HTML结构代码CSS样式代码五、更多源码二、网站介绍网站布局方面：计划采用目前主流的、能兼容各大主流浏览器、显示效果稳定的浮动网页布局结构。网站程
  • 少了生活气息 我爱大草莓
    最近啊，总觉得自己日更的内容缺了点什么。我仔细地想，大概是少了些生活气息。这两三个月减少了许多与别人相处的时间，独自生活，偶尔只是出去买菜，总觉得生活好像变空了许多。买菜的时候会跟档口的阿姨聊一两句话，让自己感觉在真实地生活着。幸好我也不是一宅到底，偶尔周末也会约着跟好朋友见面，面对面交流跟隔着屏幕交流，效果还是不一样的，至少有更为真实的生活感。写作不仅需要有阅读量，有文笔，生活阅历也是非常重要的
  • LeetCode[Math] - #66 Plus One Cwind javaLeetCode题解AlgorithmMath
    原题链接：#66 Plus One   要求： 给定一个用数字数组表示的非负整数，如num1 = {1, 2, 3, 9}, num2 = {9, 9}等，给这个数加上1。 注意： 1. 数字的较高位存在数组的头上，即num1表示数字1239 2. 每一位（数组中的每个元素）的取值范围为0~9   难度：简单   分析： 题目比较简单，只须从数组
  • JQuery中$.ajax()方法参数详解 AILIKES JavaScriptjsonpjqueryAjaxjson
    url: 要求为String类型的参数，（默认为当前页地址）发送请求的地址。 type: 要求为String类型的参数，请求方式（post或get）默认为get。注意其他http请求方法，例如put和    delete也可以使用，但仅部分浏览器支持。 timeout: 要求为Number类型的参数，设置请求超时时间（毫秒）。此设置将覆盖$.ajaxSetup()方法的全局
  • JConsole & JVisualVM远程监视Webphere服务器JVM Kai_Ge JVisualVMJConsoleWebphere
        JConsole是JDK里自带的一个工具，可以监测Java程序运行时所有对象的申请、释放等动作，将内存管理的所有信息进行统计、分析、可视化。我们可以根据这些信息判断程序是否有内存泄漏问题。 　　使用JConsole工具来分析WAS的JVM问题，需要进行相关的配置。 　　首先我们看WAS服务器端的配置. 　　1、登录was控制台https://10.4.119.18
  • 自定义annotation 120153216 annotation
    Java annotation 自定义注释@interface的用法 一、什么是注释      说起注释，得先提一提什么是元数据(metadata)。所谓元数据就是数据的数据。也就是说，元数据是描述数据的。就象数据表中的字段一样，每个字段描述了这个字段下的数据的含义。而J2SE5.0中提供的注释就是java源代码的元数据，也就是说注释是描述java源
  • CentOS 5/6.X 使用 EPEL YUM源 2002wmj centos
    CentOS 6.X 安装使用EPEL YUM源1. 查看操作系统版本[root@node1 ~]# uname -a Linux node1.test.com 2.6.32-358.el6.x86_64 #1 SMP Fri Feb 22 00:31:26 UTC 2013 x86_64 x86_64 x86_64 GNU/Linux [root@node1 ~]#
  • 在SQLSERVER中查找缺失和无用的索引SQL 357029540 SQL Server
    --缺失的索引 SELECT  avg_total_user_cost * avg_user_impact * ( user_scans + user_seeks ) AS PossibleImprovement ,          last_user_seek ,    
  • Spring3 MVC 笔记（二） —json+rest优化 7454103 Spring3 MVC
    接上次的 spring mvc 注解的一些详细信息！                          其实也是一些个人的学习笔记  呵呵！
  • 替换“\”的时候报错Unexpected internal error near index 1 \ ^ adminjun java“\替换”
    发现还是有些东西没有刻子脑子里,,过段时间就没什么概念了,所以贴出来...以免再忘...   在拆分字符串时遇到通过 \ 来拆分，可是用所以想通过转义 \\ 来拆分的时候会报异常   public class Main {          /*
  • POJ 1035 Spell checker(哈希表) aijuans 暴力求解--哈希表
    /* 题意：输入字典，然后输入单词，判断字典中是否出现过该单词，或者是否进行删除、添加、替换操作，如果是，则输出对应的字典中的单词 要求按照输入时候的排名输出 题解：建立两个哈希表。一个存储字典和输入字典中单词的排名，一个进行最后输出的判重 */ #include <iostream> //#define using namespace std; const int HASH =
  • 通过原型实现javascript Array的去重、最大值和最小值 ayaoxinchao JavaScriptarrayprototype
    用原型函数（prototype）可以定义一些很方便的自定义函数，实现各种自定义功能。本次主要是实现了Array的去重、获取最大值和最小值。 实现代码如下：   <script type="text/javascript"> Array.prototype.unique = function() { var a = {}; var le
  • UIWebView实现https双向认证请求 bewithme UIWebViewhttpsObjective-C
              什么是HTTPS双向认证我已在先前的博文 ASIHTTPRequest实现https双向认证请求 中有讲述，不理解的读者可以先复习一下。本文是用UIWebView来实现对需要客户端证书验证的服务请求，网上有些文章中有涉及到此内容，但都只言片语，没有讲完全，更没有完整的代码，让人困扰不已。但是此知
  • NoSQL数据库之Redis数据库管理(Redis高级应用之事务处理、持久化操作、pub_sub、虚拟内存) bijian1013 redis数据库NoSQL
    3.事务处理         Redis对事务的支持目前不比较简单。Redis只能保证一个client发起的事务中的命令可以连续的执行，而中间不会插入其他client的命令。当一个client在一个连接中发出multi命令时，这个连接会进入一个事务上下文，该连接后续的命令不会立即执行，而是先放到一个队列中，当执行exec命令时，redis会顺序的执行队列中
  • 各数据库分页sql备忘 bingyingao oraclesql分页
    ORACLE 下面这个效率很低 SELECT * FROM ( SELECT A.*, ROWNUM RN FROM (SELECT * FROM IPAY_RCD_FS_RETURN order by id desc) A ) WHERE RN <20; 下面这个效率很高 SELECT A.*, ROWNUM RN FROM (SELECT * FROM IPAY_RCD_
  • 【Scala七】Scala核心一：函数 bit1129 scala
    1. 如果函数体只有一行代码，则可以不用写{},比如 def print(x: Int) = println(x) 一行上的多条语句用分号隔开，则只有第一句属于方法体，例如   def printWithValue(x: Int) : String= println(x); "ABC"   上面的代码报错，因为，printWithValue的方法
  • 了解GHC的factorial编译过程 bookjovi haskell
    GHC相对其他主流语言的编译器或解释器还是比较复杂的，一部分原因是haskell本身的设计就不易于实现compiler，如lazy特性，static typed，类型推导等。 关于GHC的内部实现有篇文章说的挺好，这里，文中在RTS一节中详细说了haskell的concurrent实现，里面提到了green thread，如果熟悉Go语言的话就会发现，ghc的concurrent实现和Go有点类
  • Java-Collections Framework学习与总结-LinkedHashMap BrokenDreams LinkedHashMap
            前面总结了java.util.HashMap，了解了其内部由散列表实现，每个桶内是一个单向链表。那有没有双向链表的实现呢？双向链表的实现会具备什么特性呢？来看一下HashMap的一个子类——java.util.LinkedHashMap。       
  • 读《研磨设计模式》-代码笔记-抽象工厂模式-Abstract Factory bylijinnan abstract
    声明： 本文只为方便我个人查阅和理解，详细的分析以及源代码请移步 原作者的博客http://chjavach.iteye.com/ package design.pattern; /* * Abstract Factory Pattern * 抽象工厂模式的目的是： * 通过在抽象工厂里面定义一组产品接口，方便地切换“产品簇” * 这些接口是相关或者相依赖的
  • 压暗面部高光 cherishLC PS
    方法一、压暗高光&重新着色 当皮肤很油又使用闪光灯时，很容易在面部形成高光区域。 下面讲一下我今天处理高光区域的心得： 皮肤可以分为纹理和色彩两个属性。其中纹理主要由亮度通道（Lab模式的L通道）决定，色彩则由a、b通道确定。 处理思路为在保持高光区域纹理的情况下，对高光区域着色。具体步骤为：降低高光区域的整体的亮度，再进行着色。 如果想简化步骤，可以只进行着色（参看下面的步骤1
  • Java VisualVM监控远程JVM crabdave visualvm
    Java VisualVM监控远程JVM    JDK1.6开始自带的VisualVM就是不错的监控工具. 这个工具就在JAVA_HOME\bin\目录下的jvisualvm.exe, 双击这个文件就能看到界面   通过JMX连接远程机器, 需要经过下面的配置: 1. 修改远程机器JDK配置文件 (我这里远程机器是linux).    
  • Saiku去掉登录模块 daizj saiku登录olapBI
    1、修改applicationContext-saiku-webapp.xml <security:intercept-url pattern="/rest/**" access="IS_AUTHENTICATED_ANONYMOUSLY" />  <security:intercept-url pattern=&qu
  • 浅析 Flex中的Focus dsjt htmlFlexFlash
    关键字：focus、 setFocus、 IFocusManager、KeyboardEvent 焦点、设置焦点、获得焦点、键盘事件 一、无焦点的困扰——组件监听不到键盘事件 原因：只有获得焦点的组件（确切说是InteractiveObject）才能监听到键盘事件的目标阶段；键盘事件（flash.events.KeyboardEvent）参与冒泡阶段，所以焦点组件的父项（以及它爸
  • Yii全局函数使用 dcj3sjt126com yii
    由于YII致力于完美的整合第三方库，它并没有定义任何全局函数。yii中的每一个应用都需要全类别和对象范围。例如，Yii::app()->user;Yii::app()->params['name'];等等。我们可以自行设定全局函数，使得代码看起来更加简洁易用。(原文地址) 我们可以保存在globals.php在protected目录下。然后，在入口脚本index.php的，我们包括在
  • 设计模式之单例模式二（解决无序写入的问题） come_for_dream 单例模式volatile乱序执行双重检验锁
                    在上篇文章中我们使用了双重检验锁的方式避免懒汉式单例模式下由于多线程造成的实例被多次创建的问题，但是因为由于JVM为了使得处理器内部的运算单元能充分利用，处理器可能会对输入代码进行乱序执行（Out Of Order Execute）优化，处理器会在计算之后将乱序执行的结果进行重组，保证该
  • 程序员从初级到高级的蜕变 gcq511120594 框架工作PHPandroidhtml5
    软件开发是一个奇怪的行业，市场远远供不应求。这是一个已经存在多年的问题，而且随着时间的流逝，愈演愈烈。 我们严重缺乏能够满足需求的人才。这个行业相当年轻。大多数软件项目是失败的。几乎所有的项目都会超出预算。我们解决问题的最佳指导方针可以归结为——“用一些通用方法去解决问题，当然这些方法常常不管用，于是，唯一能做的就是不断地尝试，逐个看看是否奏效”。 现在我们把淫浸代码时间超过3年的开发人员称为
  • Reverse Linked List hcx2013 list
    Reverse a singly linked list.   /** * Definition for singly-linked list. * public class ListNode { * int val; * ListNode next; * ListNode(int x) { val = x; } * } */ p
  • 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
  • C# Ajax上传图片同时生成微缩图(附Demo) liyonghui160com
        1.Ajax无刷新上传图片,详情请阅我的这篇文章。（jquery + c# ashx）         2.C#位图处理  System.Drawing。         3.最新demo支持IE7,IE8,Fir
  • Java list三种遍历方法性能比较 pda158 java
    从c/c++语言转向java开发，学习java语言list遍历的三种方法，顺便测试各种遍历方法的性能，测试方法为在ArrayList中插入1千万条记录，然后遍历ArrayList，发现了一个奇怪的现象，测试代码例如以下： package com.hisense.tiger.list; import java.util.ArrayList; import java.util.Iterator;
  • 300个涵盖IT各方面的免费资源（上）——商业与市场篇 shoothao seo商业与市场IT资源免费资源
    A.网站模板+logo+服务器主机+发票生成 HTML5 UP:响应式的HTML5和CSS3网站模板。 Bootswatch:免费的Bootstrap主题。 Templated:收集了845个免费的CSS和HTML5网站模板。 Wordpress.org|Wordpress.com:可免费创建你的新网站。 Strikingly:关注领域中免费无限的移动优
  • localStorage、sessionStorage uule localStorage
    W3School 例子   HTML5 提供了两种在客户端存储数据的新方法： localStorage - 没有时间限制的数据存储 sessionStorage - 针对一个 session 的数据存储   之前，这些都是由 cookie 完成的。但是 cookie 不适合大量数据的存储，因为它们由每个对服务器的请求来传递，这使得 cookie 速度很慢而且效率也不
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他