rambler_designer
rambler_designer

基于Jquery的文章列表特效

1. 实现效果

类似于csdn个人博客,每篇文章都分成一个一个板块,我实现的功能是:随着浏览器滚动条往下滚动,每个文章div都以一个特效出现

2. 所需环境

<link rel="stylesheet" href="//cdn.bootcss.com/animate.css/3.5.1/animate.min.css">
<script src="https://cdn.bootcss.com/jquery-cookie/1.4.1/jquery.cookie.js">script>
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.js">script>

3. 思路来源

诗酒趁年华 【有想开发自己博客的可以模仿一下他的博客,个人认为很好看】

主要是利用animation.css提供的动画 + js监控滚动条的滚动，当div刚出现的时候播放css动画

思路:

在滚动事件中监听每一个div到当前可视窗口最下边的距离,如果到一定的返回内,则设置div可见,并播放动画(通俗点说,等div马上要从底下出现的时候,就播放动画)

简单公式:(当前元素距离顶部的距离offset.top - 浏览器向上滚动的距离scrollTop) < 当前视口的高度, 但是这样有个问题,就是如果根据这个条件进行判断, 那么在当前元素还没露出就会播放动画, 用户体验不好, 于是设置一定的偏移量

4. 代码实现


<html>
	<head>
		<meta charset="utf-8">
		<title>title>
		<link rel="stylesheet" href="//cdn.bootcss.com/animate.css/3.5.1/animate.min.css">
         <script src="https://cdn.bootcss.com/jquery-cookie/1.4.1/jquery.cookie.js">script>
         <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.js">script>
		<style>
			* {
				margin: 0;
				padding: 0;
			}
			.article {
				width: 50%;
				position: relative;
				left: 50%;
				transform: translateX(-50%);
			}
			.animated {
				height: 150px;
				width: 100%;
				margin-bottom: 10px;
				background-color: green;
			}
			.hidden {
				visibility: hidden;
			}
		style>
	head>
	<body>
		<div class="article">
			<div class="animated">1div>
			<div class="animated">2div>
			<div class="animated">3div>
			<div class="animated">4div>
			<div class="animated">5div>
			<div class="animated">5div>
			<div class="animated">5div>
			<div class="animated">5div>
			<div class="animated">5div>
		div>
		<script>
			$(document).ready(function() {
				// 兼容已经在视口内的div,自动播放动画
				$(".animated").each(function() {
					if (isUnderViewPort($(this).offset().top, $(window).scrollTop(), $(window).height(), 0)) {
						$(this).css("visibitity", "visiable");
						$(this).addClass("bounceInLeft");
					}
				})

				// 监听滚动条，监控每一个div，如果div在视口之内，则播放动画
				let windowHeight = $(window).height();
				$(window).scroll(function() {
					const scrollTop = $(window).scrollTop();
					$(".animated").each(function() {
						const offsetTop = $(this).offset().top;
						if (isUnderViewPort(offsetTop, scrollTop, windowHeight, 30)) {
							$(this).css("visibitity", "visiable");
							$(this).addClass("bounceInLeft");
						}
					})
				})
			})
			/**
			 * 判断div是否在视口（通俗点说就是浏览器可见部分）内
			 * @param {Object} offsetTop dom距离顶部的距离
			 * @param {Object} scrollTop 滚动条滚动的距离
			 * @param {Object} viewportHeight 视口的高度(浏览器高度)
			 * @param {Object} offset 偏移
			 */
			function isUnderViewPort(offsetTop, scrollTop, viewportHeight, offset) {
				if (offsetTop - scrollTop < viewportHeight - offset) return true;
				return false;
			}
		script>
	body>
html>

5. 扩展

由于css动画库用的是animation.css, 因此可以将动画库提供的所有动画写到一个json文件或者一个数组中, 然后产生一些随机数作为动画数组下标, 随机数需要存入cookie中, 否则刷新后会消失,由此可以实现每次刷新效果都不同

你可能感兴趣的:(前端)

  • 前端应用--工程化主题切换功能 xiaobing_hope CSS3node-js学习javascriptnode.js
    随着各个应用平台和网站都开始支持深色模式，相较于传统的页面配色方案，深色模式具有较好的降噪性，也能让用户的眼睛看内容更加舒适。那么对于前端开发来说，如何高效的支持深色模式呢？这里的高效指的是工程化、自动化方案，不需要在开发过程中hardcoding。PostCSS原理及相关插件能力postcss是一款使用JavaScript编写的用于编译css的工具，具有良好的插件性，非常有利于开发者扩展。原理：
  • 【含文档+PPT+源码】基于SpringBoot和Vue的编程学习系统 小咕聊编程 springbootvue.js学习
    项目介绍本课程演示的是一款基于SpringBoot和Vue的编程学习系统，主要针对计算机相关专业的正在做毕设的学生与需要项目实战练习的Java学习者。1.包含：项目源码、项目文档、数据库脚本、软件工具等所有资料2.带你从零开始部署运行本套系统3.该项目附带的源码资料可作为毕设使用该SpringBoot+Vue的编程学习系统，后端采用SpringBoot架构，前端采用Vue+ElementUI实现页
  • Virtual Scrolling 虚拟滚动优化方案 shaoin_2 前端零碎前端vue.js
    虚拟滚动（VirtualScrolling）是一种优化前端渲染大量数据的技术，它通过按需渲染可见区域的内容，避免一次性创建所有DOM元素，从而解决性能问题。以下是其核心原理：1.核心思想物理世界：假设列表有10,000条数据，传统渲染会生成10,000个DOM节点。虚拟滚动：只渲染用户当前可见的20条数据（视窗区域），其余数据通过占位和位置偏移模拟完整列表。2.实现步骤(1)容器与占位容器高度：设
  • 微前端架构 qmwneb946 科技博文前端框架
    1.微前端架构概述1.1定义与核心概念微前端架构是一种现代Web应用的架构风格，它借鉴了微服务的理念，将前端应用分解为一组小型的、独立交付的前端应用，每个应用可以独立开发、独立部署，并且可以由不同的团队使用不同的技术栈进行开发。微前端架构的核心概念包括：独立性：每个前端应用都是独立的，拥有自己的代码库、开发流程和部署周期。技术多样性：不同的前端应用可以使用不同的技术栈，如React、Vue、Ang
  • Qiankun 微前端框架全面解析：架构、原理与最佳实践 赵大仁 前端技术微前端javascript深度学习
    Qiankun微前端框架全面解析：架构、原理与最佳实践随着前端应用的不断发展，单体前端项目在复杂度、维护成本和团队协作上面临越来越多的挑战。微前端（MicroFrontends）作为解决方案之一，可以帮助企业拆分前端应用，提高可扩展性和独立部署能力。Qiankun作为基于single-spa的微前端框架，提供了一种简单高效的方式来实现微前端架构。本文将深入解析Qiankun的工作原理、核心功能、实
  • ReactNative组件详解 Code4Android 编程语言androidiosreact-native
    ReactNative学习记录传送门ReactNative核心思想就是组件化，它基于前端框架React,在我们使用其开发Android和iOS的时候，共用一套组件即一套代码，增加了代码复用性。今天的这篇文章不不分析过多的知识点，主要介绍如下内容：如何进行自定义组件如何使用自定义组件组件的生命周期自定义组件ReactNative中我们实现的UI都是有组件组成的，但是有时候为了实现我们想要的效果，并且
  • React入门简介 地信小学生 WebGIS一起学react.js前端前端框架javascript
    Vue与React是前端编程中常用的两个JS框架，两者的一些简单如下所示。Vue建立在一个基于组件的架构上，以组件为中心，可以更轻松地创建动态用户界面。它还有一个强大的双向数据绑定系统，可以让我们轻松地保持数据和用户界面同步；Vue轻量、灵活且强大，最重要的是对于初学者来说相对简单。Vue中文官网包含了详细的说明与教程：https://cn.vuejs.org/React为开发人员提供了一种声明式
  • React Native 新架构，前端开发框架 2401_83974173 2024年程序员学习reactnative架构react.js
    JSthread会先对其序列化,形成下面一条消息UIManager.createView([343,“RCTView”,31,{“backgroundColor”:-16181,“width”:200,“height”:200}])通过Bridge发到ShadowThread。ShadowTread接收到这条信息后，先反序列化，形成Shadowtree，然后传给Yoga，形成原生布局信息。接着又通
  • jQuery获取并解析API接口Json数据的方法 qhdzj87 前端（JSjQuery等）jqueryjsonjavascript
    json是API的常用数据交换格式，在Web开发中，除了后端程序，前端也可以借助JavaScript技术获取并解析API中的json数据，这里介绍一种通过jQuery的$get()函数获取并解析API接口Json数据的方法。其基本语法如下：$get(url,[data],[callback])在$get()函数中，包含了三个参数。其中：url:请求的地址;data:请求数据的列表;callback
  • 面向对象的前端开发_20多种面向前端开发人员的文档和指南（第11号） culi3118 编程语言javajavascriptpythonhtmlViewUI
    面向对象的前端开发It’sthattimeagaintogetlearning!Asbefore,I’vecollectedanumberofdifferentlearningresources,includingguides,docs,andotherusefulwebsitestohelpyougetuptospeedindifferentareasoffront-enddevelopment
  • node.js如何实现文件上传 gt8011 node.js前端expressajax
    一、是什么文件上传在日常开发中应用很广泛，我们发微博、发微信朋友圈都会用到了图片上传功能因为浏览器限制，浏览器不能直接操作文件系统的，需要通过浏览器所暴露出来的统一接口，由用户主动授权发起来访问文件动作，然后读取文件内容进指定内存里，最后执行提交请求操作，将内存里的文件内容数据上传到服务端，服务端解析前端传来的数据信息后存入文件里对于文件上传，我们需要设置请求头为content-type:mult
  • Vue.js表单输入绑定 孤客网络科技工作室 vue.jsvue.js前端javascript
    表单输入绑定在前端处理表单时，我们常常需要将表单输入框的内容同步给JavaScript中相应的变量。手动连接值绑定和更改事件监听器可能会很麻烦：templatetext=event.target.value">v-model指令帮我们简化了这一步骤：template另外，v-model还可以用于各种不同类型的输入，、元素。它会根据所使用的元素自动使用对应的DOM属性和事件组合：文本类型的和元素会绑
  • 项目开发实践——基于SpringBoot+Vue3实现的在线考试系统(一) bjzhang75 Vue知识学习及项目开发实践项目开发实践springbootvue.js在线考试系统
    文章目录一、系统说明二、技术选型三、主要成果展示四、项目框架搭建1、运行环境搭建2、前端框架搭建3、后端框架搭建五、本文代码下载一、系统说明基于SpringBoot+Vue3实现的在线考试系统是为高校打造的一款在线考试平台。系统功能说明1、系统共有管理员、老师、学生三个角色，管理员拥有系统最高权限。2、老师拥有考试管理、题库管理、成绩管理、学生管理四个模块。3、学生可以参与考试、查看成绩、试题练习
  • 一起来动手实现一个ai聊天对话
    本文，我们将根据前文来实现一个ai聊天对话项目，感受真实的业务。项目技术栈vite---一个前端工程构建工具。antd---一个reactui组件库。@ant-design/icons----一个react图标库。mockjs---模拟消息对话数据。dayjs---一个日期处理库react---一个javascript框架。typescript---javascript的超集。ew-message
  • JAVA单服务应用拆分成多个服务的实践(3)--前端的nginx转发 秤秤biubiu 开发（应用软件网站相关）niginx
    上篇文章JAVA单服务应用拆分成多个服务的实践(２)--服务的dubbo化已经将部分模块微服务化了，但我们怎么测试？我们的目标是支持ALLInOne,又要支持多个微服务，但前端怎么处理，前端代码又只有一个版本，但又要怎么面向多个微服务呢。这样的话，我们只能引入伟大的nginx。前端只认一个，就使用nginx的转发，将特定的请求转发到微服务的接口里，让前端无感请求到到另一服务中。nginx的配置如下
  • （四三）ArkTS 服务端渲染（SSR）实践 小_铁 HarmonyOSNext华为
    一、引言在当今的前端开发领域，服务端渲染（SSR）技术凭借其独特的优势逐渐成为了构建高性能Web应用的重要手段。ArkTS作为一种新兴的开发语言，具备强大的表达能力和丰富的特性，将其与SSR技术相结合，能够为用户带来更加流畅的浏览体验。本文将深入探讨ArkTS服务端渲染的实践，从概念和优势入手，介绍技术选型、开发流程、代码实现，以及部署和性能优化等方面的内容，并提供具体的代码示例。二、服务端渲染概
  • 视频教育网站开源系统的部署安装 （roncoo-education）服务器为ubuntu22.04.05 浪淘沙jkp 开源AlmaLinux视频教育网
    一、说明前端技术体系：Vue3+Nuxt3+Vite5+Vue-Router+Element-Plus+Pinia+Axios后端技术体系：SpringCloudAlibaba2021+MySQL8+Nacos+Seata+Mybatis+Druid+redis后端系统：roncoo-education（核心框架：SpringCloudAlibaba）：码云|Github门户系统：roncoo-e
  • 前端调试实战：快速定位和解决问题的技巧 Eleven 前端chromechromedevtools
    前端开发中，调试是不可避免的环节。无论是页面样式错乱、功能逻辑异常，还是性能瓶颈，都需要我们快速定位问题并找到解决方案一、调试工具篇1.ChromeDevTools：前端开发的瑞士军刀ChromeDevTools是前端开发者最强大的调试工具，它提供了丰富的功能来帮助我们分析页面、调试代码和排查问题。Elements面板:查看和修改DOM结构、CSS样式，实时预览页面效果。Console面板:执行J
  • Svelte 高效开发必备插件与工具推荐（附详细配置指南） i建模 前端开发前端框架svelte
    #Svelte必备插件与工具推荐（附详细配置指南）---##摘要Svelte作为近年来备受关注的前端框架，凭借其**编译时优化**和**极简语法**迅速赢得开发者青睐。但想要充分发挥其潜力，离不开强大的工具链支持。本文精选**10+实用插件与工具**，覆盖开发、调试、预处理、UI库等全场景，助你打造高效Svelte工作流！---##一、开发与构建工具###1.**@sveltejs/vite-pl
  • .NET周刊【2月第3期 2025-02-16】 INCerry .net
    国内文章我们是如何解决abp身上的几个痛点https://www.cnblogs.com/jackyfei/p/18709265张飞洪分享了abp框架在.net社区的使用经验，认为其在模块化、DDD和微服务上表现优良，但也存在不足。文章指出前端不支持VUE、社区版界面较差、售后服务慢及功能不易用等痛点。针对这些问题，他提出通过VUE3重做了部分功能，从而实现功能和细节的增强。例如，引入了文件管理、
  • Vue 与 React：前端框架的区别与联系 一休哥助手 前端前端框架vue.jsreact.js
    一、引言随着前端技术的发展，Vue和React作为目前最流行的前端框架之一，被广泛应用于各种Web开发项目中。尽管它们都能实现组件化开发，提高代码的复用性和可维护性，但在设计理念、使用方式以及性能优化等方面存在诸多不同。本文将详细探讨Vue和React之间的区别与联系，帮助开发者更好地理解并选择合适的技术栈。二、Vue和React的基本介绍1.Vue.js简介Vue.js（简称Vue）是由尤雨溪（
  • Tauri+React跨平台开发全场景问题解析 i建模 前端开发跨平台开发前端框架taurireact跨平台开发
    Tauri+React跨平台开发全场景问题解析一、核心优势与技术定位1.1技术架构创新Tauri2.3.1采用Rust核心层+系统WebView+React前端的混合架构，相较于传统跨平台方案具有三大突破：轻量化：安装包体积缩小至Electron的3%（{invoke('load_data').then(setData);},[]);return{data};}特点：ReactHooks与Taur
  • 如何在 React 中集成第三方库和插件 JJCTO袁龙 reactreact.js前端前端框架
    如何在React中集成第三方库和插件在现代前端开发中，React以其声明式、组件化的特性成为开发者的首选框架之一。然而，单一的框架往往无法满足所有需求，集成第三方库和插件变得尤为重要。本文将详细介绍如何在React中高效集成第三方库和插件，并提供一些最佳实践建议。一、选择合适的第三方库或插件在集成第三方库或插件之前，选择合适的工具是关键。以下是一些选择时需要考虑的因素：功能匹配：确保库或插件的功能
  • 统一封装api接口返回值（一） 异世老者 java后端javaspringrestful
    前后端分离开发模式中，后端接口基本上都是通过json格式传回前端，通过统一的返回格式封装，可以大大提高开发效率，如：{"code":0,"msg":"成功","data":{"uid":"hjgfyg"}}直接上代码，两个文件即可实现设置一个枚举值，统一封装返回状态码publicenumErrorCode{/*成功状态码*/SUCCESS(0,"成功"),ERROR(1,"操作失败"),/*web
  • mybatis后端有返回值前端拿不到 湙泽 mybatis前端java
    前端情况后端情况一开始没注意才发现是自己少了一个注解解决方法：1.@RestController在Spring中@RestController的作用等同于@Controller+@ResponseBody。2.@ResponseBody@ResponseBody的作用其实是将java对象转为json格式的数据。
  • 前端调用后端接口返回数据不显示 qq_45231791 vue
    前端调用后端接口返回数据不显示返回的数据是对象，要改为数组[res.data.data]。如果后端返回数据为List数组则不用添加中括号。
  • 响应式布局：构建适应多设备的现代网页 lina_mua css3前端csshtml
    1.引言1.1响应式布局的重要性随着移动设备的普及，用户访问网页的方式变得多样化。响应式布局（ResponsiveDesign）能够确保网站在不同设备（如桌面、平板、手机）上都能提供良好的用户体验。它不仅是现代前端开发的标配，也是提升用户满意度和SEO排名的重要手段。1.2本文的目标本文旨在深入探讨响应式布局的核心概念、实现技术、实用技巧以及最佳实践，帮助开发者构建适应多设备的现代网页。2.响应式
  • Vue 中引入 ECharts 的详细步骤与示例 黄尚圈圈 vue.jsecharts前端
    在Vue项目中引入ECharts，可以让我们轻松地在前端页面中展示各种图表。ECharts是一个基于JavaScript的开源可视化图表库，它提供了丰富的图表类型和强大的配置选项，使得在Vue项目中集成和使用变得非常方便。一、准备工作创建Vue项目：如果你还没有Vue项目，可以使用VueCLI快速创建一个新的Vue项目。安装ECharts：在你的Vue项目中，通过npm或yarn安装ECharts
  • 024：vue+threeJS 创建多面几何体（PolyhedronGeometry） 还是大剑师兰特 #ThreeJS代码示例200+大剑师threejs教程threejs示例threejs基础
    作者：还是大剑师兰特，曾为美国某知名大学计算机专业研究生，现为国内GIS领域高级前端工程师，CSDN知名博主，深耕openlayers、leaflet、mapbox、cesium，canvas，echarts等技术开发，欢迎加微信（gis-dajianshi），一起交流。查看本专栏目录-本文是第024个示例文章目录一、示例效果图二、示例简介三、配置说明四、示例源代码（共98行）五、相关文章参考一、
  • WebGL开发：ThreeJS从入门到精通 莲华君 前端权威教程合集WebGL系统化学习前端WebGLThreeJSBabylonJS
    前言：ThreeJS——开启3DWeb世界的钥匙欢迎来到ThreeJS的奇妙世界！无论你是前端开发者、图形学爱好者，还是希望将3D技术融入Web应用的工程师，这本书都将带你从零开始，逐步掌握ThreeJS的核心概念，并最终实现大型数字孪生项目。让我们一起踏上这段充满挑战与乐趣的旅程吧！目录：第一部分：ThreeJS基础入门第一章：ThreeJS概述与基础概念1.1ThreeJS是什么？介绍Thre
  • LeetCode[位运算] - #137 Single Number II Cwind javaAlgorithmLeetCode题解位运算
    原题链接：#137 Single Number II  要求： 给定一个整型数组，其中除了一个元素之外，每个元素都出现三次。找出这个元素 注意：算法的时间复杂度应为O(n)，最好不使用额外的内存空间   难度：中等   分析： 与#136类似，都是考察位运算。不过出现两次的可以使用异或运算的特性 n XOR n = 0, n XOR 0 = n，即某一
  • 《JavaScript语言精粹》笔记 aijuans JavaScript
    0、JavaScript的简单数据类型包括数字、字符创、布尔值（true/false）、null和undefined值，其它值都是对象。 1、JavaScript只有一个数字类型，它在内部被表示为64位的浮点数。没有分离出整数，所以1和1.0的值相同。 2、NaN是一个数值，表示一个不能产生正常结果的运算结果。NaN不等于任何值，包括它本身。可以用函数isNaN(number)检测NaN,但是
  • 你应该更新的Java知识之常用程序库 Kai_Ge java
    在很多人眼中，Java 已经是一门垂垂老矣的语言，但并不妨碍 Java 世界依然在前进。如果你曾离开 Java，云游于其它世界，或是每日只在遗留代码中挣扎，或许是时候抬起头，看看老 Java 中的新东西。 Guava Guava[gwɑ:və]，一句话，只要你做Java项目，就应该用Guava（Github）。 guava 是 Google 出品的一套 Java 核心库，在我看来，它甚至应该
  • HttpClient 120153216 httpclient
    /** * 可以传对象的请求转发，对象已流形式放入HTTP中 */ public static Object doPost(Map<String,Object> parmMap,String url) { Object object = null; HttpClient hc = new HttpClient(); String fullURL
  • Django model字段类型清单 2002wmj django
    Django 通过 models 实现数据库的创建、修改、删除等操作，本文为模型中一般常用的类型的清单，便于查询和使用： AutoField：一个自动递增的整型字段，添加记录时它会自动增长。你通常不需要直接使用这个字段；如果你不指定主键的话，系统会自动添加一个主键字段到你的model。(参阅自动主键字段) BooleanField：布尔字段,管理工具里会自动将其描述为checkbox。 Cha
  • 在SQLSERVER中查找消耗CPU最多的SQL 357029540 SQL Server
    返回消耗CPU数目最多的10条语句 SELECT TOP 10    total_worker_time/execution_count AS avg_cpu_cost, plan_handle,    execution_count,    (SELECT SUBSTRING(text, statement_start_of
  • Myeclipse项目无法部署，Undefined exploded archive location 7454103 eclipseMyEclipse
    做个备忘！ 错误信息为：       Undefined exploded archive location 原因：           在工程转移过程中，导致工程的配置文件出错； 解决方法：    
  • GMT时间格式转换 adminjun GMT时间转换
    普通的时间转换问题我这里就不再罗嗦了，我想大家应该都会那种低级的转换问题吧，现在我向大家总结一下如何转换GMT时间格式，这种格式的转换方法网上还不是很多，所以有必要总结一下，也算给有需要的朋友一个小小的帮助啦。 1、可以使用 SimpleDateFormat SimpleDateFormat    EEE-三位星期 d-天 MMM-月 yyyy-四位年
  • Oracle数据库新装连接串问题 aijuans oracle数据库
    割接新装了数据库，客户端登陆无问题，apache/cgi-bin程序有问题，sqlnet.log日志如下： Fatal NI connect error 12170.   VERSION INFORMATION:         TNS for Linux: Version 10.2.0.4.0 - Product
  • 回顾java数组复制 ayaoxinchao java数组
    在写这篇文章之前，也看了一些别人写的，基本上都是大同小异。文章是对java数组复制基础知识的回顾，算是作为学习笔记，供以后自己翻阅。首先，简单想一下这个问题：为什么要复制数组？我的个人理解：在我们在利用一个数组时，在每一次使用，我们都希望它的值是初始值。这时我们就要对数组进行复制，以达到原始数组值的安全性。java数组复制大致分为3种方式：①for循环方式 ②clone方式 ③arrayCopy方
  • java web会话监听并使用spring注入 bewithme Java Web
            在java web应用中，当你想在建立会话或移除会话时，让系统做某些事情，比如说，统计在线用户，每当有用户登录时，或退出时，那么可以用下面这个监听器来监听。        import java.util.ArrayList; import java.ut
  • NoSQL数据库之Redis数据库管理(Redis的常用命令及高级应用) bijian1013 redis数据库NoSQL
    一 .Redis常用命令         Redis提供了丰富的命令对数据库和各种数据库类型进行操作，这些命令可以在Linux终端使用。         a.键值相关命令         b.服务器相关命令 1.键值相关命令       &
  • java枚举序列化问题 bingyingao java枚举序列化
    对象在网络中传输离不开序列化和反序列化。而如果序列化的对象中有枚举值就要特别注意一些发布兼容问题: 1.加一个枚举值 新机器代码读分布式缓存中老对象，没有问题，不会抛异常。 老机器代码读分布式缓存中新对像，反序列化会中断，所以在所有机器发布完成之前要避免出现新对象，或者提前让老机器拥有新增枚举的jar。 2.删一个枚举值 新机器代码读分布式缓存中老对象，反序列
  • 【Spark七十八】Spark Kyro序列化 bit1129 spark
    当使用SparkContext的saveAsObjectFile方法将对象序列化到文件，以及通过objectFile方法将对象从文件反序列出来的时候，Spark默认使用Java的序列化以及反序列化机制，通常情况下，这种序列化机制是很低效的，Spark支持使用Kyro作为对象的序列化和反序列化机制，序列化的速度比java更快，但是使用Kyro时要注意，Kyro目前还是有些bug。 Spark
  • Hybridizing OO and Functional Design bookjovi erlanghaskell
      推荐博文： Tell Above, and Ask Below - Hybridizing OO and Functional Design 文章中把OO和FP讲的深入透彻，里面把smalltalk和haskell作为典型的两种编程范式代表语言，此点本人极为同意，smalltalk可以说是最能体现OO设计的面向对象语言，smalltalk的作者Alan kay也是OO的最早先驱，
  • Java-Collections Framework学习与总结-HashMap BrokenDreams Collections
            开发中常常会用到这样一种数据结构，根据一个关键字，找到所需的信息。这个过程有点像查字典，拿到一个key，去字典表中查找对应的value。Java1.0版本提供了这样的类java.util.Dictionary(抽象类)，基本上支持字典表的操作。后来引入了Map接口，更好的描述的这种数据结构。  &nb
  • 读《研磨设计模式》-代码笔记-职责链模式-Chain Of Responsibility bylijinnan java设计模式
    声明： 本文只为方便我个人查阅和理解，详细的分析以及源代码请移步 原作者的博客http://chjavach.iteye.com/ /** * 业务逻辑：项目经理只能处理500以下的费用申请，部门经理是1000，总经理不设限。简单起见，只同意“Tom”的申请 * bylijinnan */ abstract class Handler { /*
  • Android中启动外部程序 cherishLC android
    1、启动外部程序 引用自： http://blog.csdn.net/linxcool/article/details/7692374 //方法一 Intent intent=new Intent(); //包名 包名+类名（全路径） intent.setClassName("com.linxcool", "com.linxcool.PlaneActi
  • summary_keep_rate coollyj SUM
    BEGIN /*DECLARE minDate varchar(20) ; DECLARE maxDate varchar(20) ;*/ DECLARE stkDate varchar(20) ; DECLARE done int default -1; /* 游标中 注册服务器地址 */ DE
  • hadoop hdfs 添加数据目录出错 daizj hadoophdfs扩容
    由于原来配置的hadoop data目录快要用满了，故准备修改配置文件增加数据目录，以便扩容，但由于疏忽，把core-site.xml, hdfs-site.xml配置文件dfs.datanode.data.dir 配置项增加了配置目录，但未创建实际目录，重启datanode服务时，报如下错误： 2014-11-18 08:51:39,128 WARN org.apache.hadoop.h
  • grep 目录级联查找 dongwei_6688 grep
           在Mac或者Linux下使用grep进行文件内容查找时，如果给定的目标搜索路径是当前目录，那么它默认只搜索当前目录下的文件，而不会搜索其下面子目录中的文件内容，如果想级联搜索下级目录，需要使用一个“-r”参数： grep -n -r "GET" .   上面的命令将会找出当前目录“.”及当前目录中所有下级目录
  • yii 修改模块使用的布局文件 dcj3sjt126com yiilayouts
    方法一：yii模块默认使用系统当前的主题布局文件，如果在主配置文件中配置了主题比如: 'theme'=>'mythm', 那么yii的模块就使用 protected/themes/mythm/views/layouts 下的布局文件； 如果未配置主题，那么 yii的模块就使用  protected/views/layouts 下的布局文件， 总之默认不是使用自身目录 pr
  • 设计模式之单例模式 come_for_dream 设计模式单例模式懒汉式饿汉式双重检验锁失败无序写入
                    今天该来的面试还没来，这个店估计不会来电话了，安静下来写写博客也不错，没事翻了翻小易哥的博客甚至与大牛们之间的差距，基础知识不扎实建起来的楼再高也只能是危楼罢了，陈下心回归基础把以前学过的东西总结一下。   *********************************
  • 8、数组 豆豆咖啡 二维数组数组一维数组
      一、概念       数组是同一种类型数据的集合。其实数组就是一个容器。   二、好处       可以自动给数组中的元素从0开始编号，方便操作这些元素   三、格式   //一维数组 1,元素类型[] 变量名 = new 元素类型[元素的个数] int[] arr =
  • Decode Ways hcx2013 decode
    A message containing letters from A-Z is being encoded to numbers using the following mapping: 'A' -> 1 'B' -> 2 ... 'Z' -> 26 Given an encoded message containing digits, det
  • 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
  • squid3(高命中率)缓存服务器配置 liyonghui160com
        系统:centos 5.x   需要的软件:squid-3.0.STABLE25.tar.gz 1.下载squid wget http://www.squid-cache.org/Versions/v3/3.0/squid-3.0.STABLE25.tar.gz tar zxf squid-3.0.STABLE25.tar.gz &&
  • 避免Java应用中NullPointerException的技巧和最佳实践 pda158 java
    1) 从已知的String对象中调用equals()和equalsIgnoreCase()方法，而非未知对象。 　　总是从已知的非空String对象中调用equals()方法。因为equals()方法是对称的，调用a.equals(b)和调用b.equals(a)是完全相同的，这也是为什么程序员对于对象a和b这么不上心。如果调用者是空指针，这种调用可能导致一个空指针异常 Object unk
  • 如何在Swift语言中创建http请求 shoothao httpswift
    概述：本文通过实例从同步和异步两种方式上回答了”如何在Swift语言中创建http请求“的问题。 如果你对Objective-C比较了解的话，对于如何创建http请求你一定驾轻就熟了，而新语言Swift与其相比只有语法上的区别。但是，对才接触到这个崭新平台的初学者来说，他们仍然想知道“如何在Swift语言中创建http请求？”。 在这里,我将作出一些建议来回答上述问题。常见的
  • Spring事务的传播方式 uule spring事务
    传播方式：        新建事务       required       required_new   - 挂起当前         非事务方式运行       supports   &nbs
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他