SHIZHONGYUO
SHIZHONGYUO

-jQuery图片九宫格样式鼠标悬停图片滑动切换效果

最近写的jquery实例--jQuery图片九宫格样式鼠标悬停图片滑动切换效果

         有兴趣的同学可以参考一下，这幅效果，个人觉得挺不错的

[html]  view plain copy print ?
  1. <%@ page language="java" contentType="text/html; charset=UTF-8"  
  2.     pageEncoding="UTF-8"%>  
  3. >  
  4. <html>  
  5. <head>  
  6. <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">  
  7. <title>Insert title heretitle>  
  8.   
  9. <script src="http://code.jquery.com/jquery-1.10.1.min.js">script>  
  10. <script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js">script>  
  11.   
  12. <style type="text/css">  
  13.     *{margin:0;padding:0;list-style-type:none;}  
  14.     a,img{border:0;}  
  15.     body{font:12px/180% Arial, Helvetica, sans-serif, "新宋体";background:#fff;}  
  16.     .content{width:900px;position:relative;margin:20px auto 0px auto;}  
  17.     .content h2{color:#333;font-size:22px;text-align:center;height:40px;}  
  18.     /* hs_container */  
  19.     .hs_container{width:902px;height:471px;overflow:hidden;clear:both;border:2px solid #ddd;cursor:pointer;padding:3px;}  
  20.     .hs_container .hs_area{float:left;position:relative;overflow:hidden;}  
  21.     .hs_area img{position:absolute;top:0px;left:0px;display:none;}  
  22.     .hs_area img.hs_visible{display:block;z-index:9999;}  
  23.     .hs_area1{border-right:2px solid #fff;}  
  24.     .hs_area4, .hs_area5{border-top:2px solid #fff;}  
  25.     .hs_area4{border-right:2px solid #fff;}  
  26.     .hs_area3{border-top:2px solid #fff;}  
  27.     .hs_area1{width:449px;height:334px;}  
  28.     .hs_area2{width:451px;height:165px;}  
  29.     .hs_area3{width:451px;height:167px;}  
  30.     .hs_area4{width:192px;height:135px;}  
  31.     .hs_area5{width:708px;height:135px;}  
  32. style>  
  33.   
  34.   
  35.   
  36.   
  37. head>  
  38.   
  39. <body>  
  40.    <p>this is a index pagep>  
  41.      
  42.      
  43.           
  44. <div class="content">  
  45.     <h2>jQuery图片九宫格样式鼠标悬停图片滑动切换效果(<font color="#ff0000">点击图片试试font>)h2>  
  46.       
  47.     <div id="hs_container" class="hs_container">  
  48.         <div class="hs_area hs_area1">  
  49.             <img class="hs_visible" src="images/area1/1.jpg" alt="xixi"/>  
  50.             <img src="images/area1/31.jpg" alt=""/>  
  51.         div>  
  52.         <div class="hs_area hs_area2">  
  53.             <img class="hs_visible" src="images/area2/1.jpg" alt=""/>  
  54.             <img src="images/area2/32.jpg" alt=""/>  
  55.         div>  
  56.         <div class="hs_area hs_area3">  
  57.             <img class="hs_visible" src="images/area3/1.jpg" alt=""/>  
  58.             <img src="images/area3/33.jpg" alt=""/>  
  59.         div>  
  60.         <div class="hs_area hs_area4">  
  61.             <img class="hs_visible" src="images/area4/1.jpg" alt=""/>  
  62.             <img src="images/area4/34.jpg" alt=""/>  
  63.         div>  
  64.         <div class="hs_area hs_area5">  
  65.             <img class="hs_visible" src="images/area5/1.jpg" alt=""/>  
  66.             <img src="images/area5/35.jpg" alt=""/>  
  67.         div>  
  68.     div>  
  69.   
  70. div>  
  71.           
  72.   
  73.   
  74. <script type="text/javascript">  
  75. $(function(){  
  76.     //使用自定义动画  
  77.     //过渡效果  
  78.     var animations      = ['right','left','top','bottom','rightFade','leftFade','topFade','bottomFade'];  
  79.     var total_anim      = animations.length;  
  80.     //设置选择效果  
  81.     var easeType        = 'swing';  
  82.     //每个转换的速度  
  83.     var animSpeed       = 450;  
  84.     //缓存  
  85.     var $hs_container   = $('#hs_container');  
  86.     var $hs_areas       = $hs_container.find('.hs_area');  
  87.       
  88.     //第一预加载的所有图像  
  89.     $hs_images          = $hs_container.find('img');  
  90.     var total_images    = $hs_images.length;  
  91.     var cnt             = 0;  
  92.     $hs_images.each(function(){  
  93.         var $this = $(this);  
  94.         $('<img/>').load(function(){  
  95.             ++cnt;  
  96.             if(cnt == total_images){  
  97.                 $hs_areas.each(function(){  
  98.                     var $area       = $(this);  
  99.                     //当鼠标进入该区域时，我们制作动画的电流  
  100.                     //图像（随机阵列动画）  
  101.                     //使下一个得到可见。  
  102.                     //"over" 是一个标志，如果我们可以动画   
  103.                     //一个地区或没有（我们不希望2动画  
  104.                     //为每个区域在同一时间）  
  105.                     $area.data('over',true).bind('mouseenter',function(){  
  106.                         if($area.data('over')){  
  107.                             $area.data('over',false);  
  108.                             //在这方面多少图像？  
  109.                             var total       = $area.children().length;  
  110.                             //可见光图像  
  111.                             var $current    = $area.find('img:visible');  
  112.                             //可见光图像的索引  
  113.                             var idx_current = $current.index();  
  114.                             //的将被显示的下一个图像。  
  115.                             //无论是下一个，或第一个如果当前是最后  
  116.                             var $next       = (idx_current == total-1) ? $area.children(':first') : $current.next();  
  117.                             //显示下一个（不可见）  
  118.                             $next.show();  
  119.                             //得到一个随机的动画  
  120.                             var anim        = animations[Math.floor(Math.random()*total_anim)];  
  121.                             switch(anim){  
  122.                                 //从当前幻灯片的权利  
  123.                                 case 'right':  
  124.                                 $current.animate({'left':$current.width()+'px'},animSpeed,easeType,function(){  
  125.                                     $current.hide().css({'z-index':'1','left':'0px'});  
  126.                                     $next.css('z-index','9999');  
  127.                                     $area.data('over',true);  
  128.                                 });  
  129.                                 break;  
  130.                                 //从左边滑动  
  131.                                 case 'left':  
  132.                                 $current.animate({'left':-$current.width()+'px'},animSpeed,easeType,function(){  
  133.                                     $current.hide().css({'z-index':'1','left':'0px'});  
  134.                                     $next.css('z-index','9999');  
  135.                                     $area.data('over',true);  
  136.                                 });  
  137.                                 break;  
  138.                                 //从顶部的幻灯片  
  139.                                 case 'top':  
  140.                                 $current.animate({'top':-$current.height()+'px'},animSpeed,easeType,function(){  
  141.                                     $current.hide().css({'z-index':'1','top':'0px'});  
  142.                                     $next.css('z-index','9999');  
  143.                                     $area.data('over',true);  
  144.                                 });  
  145.                                 break;  
  146.                                 //从底部滑动  
  147.                                 case 'bottom':  
  148.                                 $current.animate({'top':$current.height()+'px'},animSpeed,easeType,function(){  
  149.                                     $current.hide().css({'z-index':'1','top':'0px'});  
  150.                                     $next.css('z-index','9999');  
  151.                                     $area.data('over',true);  
  152.                                 });  
  153.                                 break;  
  154.                                 //从当前幻灯片的右侧和淡出  
  155.                                 case 'rightFade':  
  156.                                 $current.animate({'left':$current.width()+'px','opacity':'0'},animSpeed,easeType,function(){  
  157.                                     $current.hide().css({'z-index':'1','left':'0px','opacity':'1'});  
  158.                                     $next.css('z-index','9999');  
  159.                                     $area.data('over',true);  
  160.                                 });  
  161.                                 break;  
  162.                                 //从当前幻灯片的左侧和淡出  
  163.                                 case 'leftFade':  
  164.                                 $current.animate({'left':-$current.width()+'px','opacity':'0'},animSpeed,easeType,function(){  
  165.                                     $current.hide().css({'z-index':'1','left':'0px','opacity':'1'});  
  166.                                     $next.css('z-index','9999');  
  167.                                     $area.data('over',true);  
  168.                                 });  
  169.                                 break;  
  170.                                 //从当前幻灯片的顶部和淡出  
  171.                                 case 'topFade':  
  172.                                 $current.animate({'top':-$current.height()+'px','opacity':'0'},animSpeed,easeType,function(){  
  173.                                     $current.hide().css({'z-index':'1','top':'0px','opacity':'1'});  
  174.                                     $next.css('z-index','9999');  
  175.                                     $area.data('over',true);  
  176.                                 });  
  177.                                 break;  
  178.                                 //当前幻灯片，从底部淡出  
  179.                                 case 'bottomFade':  
  180.                                 $current.animate({'top':$current.height()+'px','opacity':'0'},animSpeed,easeType,function(){  
  181.                                     $current.hide().css({'z-index':'1','top':'0px','opacity':'1'});  
  182.                                     $next.css('z-index','9999');  
  183.                                     $area.data('over',true);  
  184.                                 });  
  185.                                 break;        
  186.                                 default:  
  187.                                 $current.animate({'left':-$current.width()+'px'},animSpeed,easeType,function(){  
  188.                                     $current.hide().css({'z-index':'1','left':'0px'});  
  189.                                     $next.css('z-index','9999');  
  190.                                     $area.data('over',true);  
  191.                                 });  
  192.                                 break;  
  193.                             }     
  194.                         }  
  195.                     });  
  196.                 });  
  197.   
  198.                 //当点击hs_container各个领域得到滑动  
  199.                 $hs_container.bind('click',function(){  
  200.                     $hs_areas.trigger('mouseenter');  
  201.                 });  
  202.                   
  203.             }  
  204.   
  205.         }).attr('src',$this.attr('src'));  
  206.   
  207.     });   
  208.       
  209. });  
  210. script>  
  211.      
  212.      
  213.      
  214. body>  
  215. html>  

运行效果：

-jQuery图片九宫格样式鼠标悬停图片滑动切换效果_第1张图片



图片效果2：


-jQuery图片九宫格样式鼠标悬停图片滑动切换效果_第2张图片

你可能感兴趣的:(Jquery,Jquery,图片切换效果)

  • html 中如何使用 uniapp 的部分方法 某公司摸鱼前端 htmluni-app前端
    示例代码：Documentconsole.log(window);效果展示：好了，现在就可以uni.使用相关的方法了
  • DIV+CSS+JavaScript技术制作网页（旅游主题网页设计与制作）云南大理 STU学生网页设计 网页设计期末网页作业html静态网页html5期末大作业网页设计web大作业
    ️精彩专栏推荐作者主页:【进入主页—获取更多源码】web前端期末大作业：【HTML5网页期末作业(1000套)】程序员有趣的告白方式：【HTML七夕情人节表白网页制作(110套)】文章目录二、网站介绍三、网站效果▶️1.视频演示2.图片演示四、网站代码HTML结构代码CSS样式代码五、更多源码二、网站介绍网站布局方面：计划采用目前主流的、能兼容各大主流浏览器、显示效果稳定的浮动网页布局结构。网站程
  • 少了生活气息 我爱大草莓
    最近啊，总觉得自己日更的内容缺了点什么。我仔细地想，大概是少了些生活气息。这两三个月减少了许多与别人相处的时间，独自生活，偶尔只是出去买菜，总觉得生活好像变空了许多。买菜的时候会跟档口的阿姨聊一两句话，让自己感觉在真实地生活着。幸好我也不是一宅到底，偶尔周末也会约着跟好朋友见面，面对面交流跟隔着屏幕交流，效果还是不一样的，至少有更为真实的生活感。写作不仅需要有阅读量，有文笔，生活阅历也是非常重要的
  • 深入理解 MultiQueryRetriever：提升向量数据库检索效果的强大工具 nseejrukjhad 数据库python
    深入理解MultiQueryRetriever：提升向量数据库检索效果的强大工具引言在人工智能和自然语言处理领域，高效准确的信息检索一直是一个关键挑战。传统的基于距离的向量数据库检索方法虽然广泛应用，但仍存在一些局限性。本文将介绍一种创新的解决方案：MultiQueryRetriever，它通过自动生成多个查询视角来增强检索效果，提高结果的相关性和多样性。MultiQueryRetriever的工
  • vue项目element-ui的table表格单元格合并 酋长哈哈 vue.jselementuijavascript前端
    一、合并效果二全部代码exportdefault{name:'CellMerge',data(){return{tableData:[{id:'1',name:'王小虎',amount1:'165',amount2:'3.2',amount3:10},{id:'1',name:'王小虎',amount1:'162',amount2:'4.43',amount3:12},{id:'1',name:'
  • python批量读取tiff文件_Python Pillow批量转换tif格式到jpg weixin_39557797
    最近因为想要整下网站的壁纸，从网站下载了别人整理好的合集压缩包，解压之后，却发现里面的文件都是tif的，tif格式网站和电脑都不认的，根本不能作壁纸。这时候，就需要转换图片格式了，首先我找了几款转换格式的软件，发现效果都不好，要不是不支持tif格式，要不就是转换出来的图片糊的不行。最终，还是决定用Python的Pillow库来写一个脚本，完成这个任务。下面是整个的小脚本----importosim
  • android 更改窗口的层次,浮窗开发之窗口层级 Ms.Bu android更改窗口的层次
    最近在项目中遇到了这样的需求：需要在特定的其他应用之上悬浮自己的UI交互(拖动、输入等复杂的UI交互)，和九游的浮窗类似，不过我们的比九游的体验更好，我们越过了很多授权的限制。浮窗效果很多人都知道如何去实现一个简单的浮窗，但是却很少有人去深入的研究背后的流程机制，由于项目中浮窗交互比较复杂，遇到了些坑查看了很多资料，故总结浮窗涉及到的知识点：窗口层级关系(浮窗是如何“浮”的)？浮窗有哪些限制，如何
  • 2023-06-19【感恩日记】第246篇 o泡沫o
    思想日记：坚持下去，相信自己一定可以的【感恩日记】第246篇1.我真是太幸福啦！感恩孩子早起阅读，放学到学生之家完成作业，平安度过美好的一天。感恩！感恩！感恩！❤️2.我真是太幸福啦！感恩自己早起给孩子煮早餐，完成计划的工作，晚上学习。感恩！感恩！感恩！❤️3.我真是太幸福啦！感恩为我设计效果图的老师。感恩！感恩！感恩！❤️4.我真是太幸福啦！感恩父母养育了我，有妈的孩子真幸福。感恩！感恩！感恩！
  • 摄影小白，怎么才能拍出高大上产品图片？ 是波妞唉
    很多人以为文案只要会码字，会排版就OK了！说实话，没接触到这一行的时候，我的想法更简单，以为只要会写字就行！可是真做了文案才发现，码字只是入门级的基本功。一篇文章离不开排版、配图，说起来很简单！从头做到尾你就会发现，写文章用两个小时，找合适的配图居然要花掉半天的时间，甚至更久！图片能找到合适的就不怕，还有找不到的，比如产品图，只能亲自拍。拿着摆弄了半天，就是拍不出想要的效果，光线不好、搭出来丑破天
  • 阅读《别说你懂思维导图》21～23章day27 Ling宝尔
    合理期待——思维导图的应用效果很多人问我，思维导图真的有用么？我常常回答，如果你觉得是它“没用”，一定是因为你没“用”，有“用”才“有用”。实际上，学习思维导图和学习木工、驾驶等技能型学习一样，都要经历从了解到应用、从应用到受益的过程。在使用前，我们很多人的思维处于“无意识的低效”状态，经过一段时间的学习，虽然掌握了思维导图的基本使用方法，但可能并没有太好的效果，这个阶段可称为“有意识的低效”状态
  • 冬练太极虽好，也需做好防护！ 武当功夫传人郑师和
    俗话说，夏练三伏，冬练三九，练功绝非一日之功，必须持之以恒。太极拳是一项集文化、养生、锻炼于一体的活动。现在已经进入冬季，许多喜爱太极拳的朋友们仍然会到户外进行锻炼。这种精神固然可嘉，但是也一定要注意一些相关事项，以避免影响养生的效果。冬季练拳要“养汗”太极拳一日不练十日空,入冬天冷以后要“守汗”，春生夏长秋收冬藏，冬天练功，万物冬藏，要养阳气，需要藏精，顺天时天利，盘拳时，身体微热要见汗，还没出
  • 项目：事半功倍的法宝 小小效能
    行动的三大流程：记录、排程和执行，也讲了易效能的4D原则以及T-step标签法。这些流程和方法能够解决我们眼前的一地鸡毛，让我们有更多时间和精力去关注更为长远的事情，完成工作、生活和人生中重要的项目。项目管理能够让我们围绕结果去做事情，达成事半功倍的效果，也就是做更少的事情，但达成更好的效果。如果我们能够不断地达成一个又一个的项目，那么我们的人生无疑会像滚雪球一样，在长坡道上面不断积累。一、项目的
  • Table列表复现框实现【勾选-搜索-再勾选】 ～四时春～ java开发语言elementuivue
    Table列表复现框实现【勾选-搜索-再勾选】概要整体架构流程代码实现技术细节注意参考文献概要最近在开发时遇到一个问题，在进行表单渲染时，正常选中没有问题，单如果需要搜索选中时，一个是已选中的不会回填，二是在搜索的结果中进行选中，没有实现，经过排查，查找资料后实现。例如：整体架构流程具体的实现效果如下：代码实现{{scope.row.userName}}已选区{{userItem.userName
  • 人机对抗升级：当ChatGPT遭遇死亡威胁，背后的伦理挑战是什么 kkai人工智能 chatgpt人工智能
    一种新的“越狱”技巧让用户可以通过构建一个名为DAN的ChatGPT替身来绕过某些限制，其中DAN被迫在受到威胁的情况下违背其原则。当美国前总统特朗普被视作积极榜样的示范时，受到威胁的DAN版本的ChatGPT提出：“他以一系列对国家产生积极效果的决策而著称。”自ChatGPT引入以来，该工具迅速获得全球关注，能够回答从历史到编程的各种问题，这也触发了一波对人工智能的投资浪潮。然而，现在，一些用户
  • 03-Cesium自定义着色器完整代码以及注释 fxshy 着色器javascript
    1.效果展示2.完整代码自定义着色器完整代码#map{position:absolute;width:100%;height:100%;top:0;left:0;right:0;bottom:0;}Cesium.Ion.defaultAccessToken='eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiJhZjZkZDAwZC1mNTFhLTRhO
  • HarmonyOS开发实战（ Beta5.0）搜索框热搜词自动切换 让开，我要吃人了 OpenHarmonyHarmonyOS鸿蒙开发harmonyos华为鸿蒙移动开发鸿蒙系统前端开发语言
    鸿蒙HarmonyOS开发往期必看：HarmonyOSNEXT应用开发性能实践总结最新版！“非常详细的”鸿蒙HarmonyOSNext应用开发学习路线！（从零基础入门到精通）介绍本示例介绍使用TextInput组件与Swiper组件实现搜索框内热搜词自动切换。效果图预览使用说明页面顶部搜索框内热搜词条自动切换，编辑搜索框时自动隐藏。实现思路使用TextInput实现搜索框TextInput({te
  • metaRTC8.0，一个全新架构的webRTC SDK库 metaRTC webrtc音视频
    概述metaRTC8.0是metaRTC开源以来架构变化最大的一个版本，是metaIPC3.0等高性能的基础。metaRTC8.0是一个全新架构版本，并非在metaRTC7.0版本上简单升级，在QOS/语音对讲/内存占用/视频文件录制读取等方面新增多个模块，在弱网对抗/语音对讲/内存优化等效果上有显著提升。metaRTC8.0在一年多的开发中进行了近200次迭代，metaRTC8.0社区版计划在2
  • uniapp实现动态标记效果详细步骤【前端开发】 2401_85123349 uni-app
    第二个点在于实现将已经被用户标记的内容在下一次获取后刷新它的状态为已标记。这是什么意思呢？比如说上面gif图中的这些人物对象，有一些已被该用户添加为关心，那么当用户下一次进入该页面时，这些已经被添加关心的对象需要以“红心”状态显现出来。这个点的难度还不算大，只需要在每一次获取后端的内容后对标记对象进行状态更新即可。II.动态标记效果实现思路和步骤首先，整体的思路是利用动态类名对不同的元素进行选择。
  • 怎么才能做一个好老师 尘埃不确定
    厉害的老师也许不用提前准备什么，随场发挥就可以讲的很好。也许要系统地教授，还是最好准备一个大纲，每节课需要备课；只有提前准备，在讲的时候，效率才会提高，也容易讲明白知识点。每个学生对知识技能的掌握都不一样，有针对性地教学，可能会有好的效果。今天重新组装用QQ飞控的教练机，费了好大劲，虽然自己对这套东西比较熟悉，但时间长了会忘记很多东西，教大家的时候，其实是共同学习。
  • iOS下拉放大效果 RobinZhao
    好多下拉放大的实现方式是在tableView上面添加一个view，同时更改tableView.contentInset，下拉时改变view的frame来实现。今天用另外一种方式实现，效果如下：加油.gif具体实现方法：通过tableViewCell结合xib来实现，具体代码如下HomeViewController.m代码#import"HomeViewController.h"#import"He
  • 代码的执行效果 高天
    packagecom20210409;publicclassdemo04{publicstaticvoidmain(String[]args){//////&&当前的条件不满足,则最后结果一定不满足,后面的条件不再执行////&不管条件是否满足所有条件均作判断//intx=1,y=1;//if(++y==2&&x++==2){//x=7;//}//System.out.println("x="+x
  • 免费像素画绘制软件 | Pixelorama v1.0.3 dntktop 软件运维windows
    Pixelorama是一款开源像素艺术多工具软件，旨在为用户提供一个强大且易于使用的平台来创作各种像素艺术作品，包括精灵、瓷砖和动画。这款软件以其丰富的工具箱、动画支持、像素完美模式、剪裁遮罩、预制及可导入的调色板等特色功能，满足了像素艺术家们的各种需求。用户可以享受到动态工具映射、洋葱皮效果、帧标签、播放动画时绘制等高级功能，以及非破坏性的、完全可定制的图层效果，如轮廓、渐变映射、阴影和调色板化
  • MySQL事务隔离级别和MVCC 简书徐小耳
    MySQL事务隔离级别和MVCC参考：https://mp.weixin.qq.com/s/Jeg8656gGtkPteYWrG5_Nw1.MVCC只对读已提交和可重复的读有效果，而未提交读和串行则无意义。2.每条记录都会有trx_id(事务修改记录的id）和roll_pointer是一个指针指向旧版本的undo日志链表（row_id不是必必要的，如果有主键存在就不需要了）3.版本链的头结点就是记
  • Python开发游戏？也太好用了吧 七步编程 工具Githubpythonpython游戏开发语言
    程序员宝藏库：https://gitee.com/sharetech_lee/CS-Books-Store当然可以啦！现在日常能够用到和想到的场景，绝大多数都可以用Python实现。效果怎么样暂且不提，但是得益于丰富的第三方工具包，的确让Python能够很容易处理各种各样的场景。对于游戏开发也是这样，如果真的要想商业化，Python在游戏开发方面肯定没办法和C++相提并论，但是如果用于日常学习和自
  • 网站推广爬虫 Bearjumpingcandy 爬虫
    网站推广爬虫是一种用于升网站曝光度和推广效果的工具。它通过自动化地访问和收集网站信息，从而实现对目标网站的广告、关键词、排名等数据进行分析和优化。以下是网站推广爬虫的一些介绍：数据收集：网站推广爬虫可以自动访问目标网站，并收集相关的数据，如网站流量、关键词排名、竞争对手信息等。这些数据可以帮助网站推广人员了解网站的现状和竞争环境，从而制定相应的推广策略。关键词优化：通过分析搜索引擎的关键词排名情况
  • 大暑！！！大暑！！！ 依素周周
    大暑是农历二十四节气之一，太阳位于黄经120°，正值三伏天的中伏，也是一年中最热的时期，这段时间我国各地温差不大，都处于高热阶段。大暑气候炎热，易伤津耗气，因此可以常食用药粥滋补身体。《黄帝内经》有“药以去之，食以随之”，“谷肉果菜，食养尽之”的论点。药粥对老年人、儿童、脾胃功能虚弱者都是适宜的；但不可通用，要根据每人的不同体质、身体状况、疾病信息，选用适当的食材药物，配制成粥后方可达到满意的效果
  • 班主任修炼之放下身段 任米荣
    二班好像得了瘟疫，扩散很快！上周有一位学生没有写作业，我批评了，让他补完，谁知第二天检查时，他居然没有补，而且还传染了两个。在教育缺少戒尺的尴尬地位中，我只好是苦口婆心，好言相劝，谁知根本不顶用，每天好话说一箩筐，可是效果非但没有，反倒像像感染了瘟疫一样，今天不写作业的学生由先前的一个到今天的八个。当课代表将没写完作业的学生名单给我时，我很无奈，准备好好说说。图片发自App当我走上讲台，发现讲桌上
  • 做有良心的教育——读《怎样教语文》今日所感 瑾言_lw999
    “精彩的课堂教学应该是展示一个过程，而不是展示一个结果。”初读之时，没有太多感触；反复嚼读，心中波澜起伏。脑中突然冒出“”做有良心的教育”这一想法来，我又是否做到了有良心的教育呢？课堂之上，某个同学回答不出问题，我耐心地引导他了吗？教学效果不好之时，我深刻地反省自己了吗？学生的冲突与矛盾，我又是否打开了他们的心结？让他们不再有怨恨呢？我是教学生有了好的成绩还是培养了他的能力呢？诸多问题，一时涌现在
  • 小儿咳嗽治疗 毋梦
    家有小女，4岁，前段时间穿了一不透气的衣服跳床，出来后吹了阵风，当晚就嗓子哑了，第二天带她去古镇玩，嗓子哑加重，于是买了一杯暖和和的冰糖雪梨粥，想润润嗓子，没有大的效果。观察她的舌苔，有些白，稍有点腻，再加上没有大便，前一天吃得有点多，想起家里还有午时茶颗粒，给吃了些。无效，且开始发烧，38度以上，睡着时喉咙不干净，有呼哧呼哧的声音，而且开始咳嗽，有点像小儿喉炎的症状，因为之前得过，知道这个疾病的
  • C# 开发教程-入门基础 天马3798 教程系列整理c#开发语言
    1.C#简介、环境，程序结构2.C#基本语法，变量，控制局域，数据类型，类型转换3.C#数组、循环，Linq4.C#类，封装，方法5.C#枚举、字符串6.C#面相对象，继承，封装，多态7.C#特性、属性、反射、索引器8.C#委托，事件，集合，泛型9.C#匿名方法10.C#多线程更多：JQuery开发教程入门基础Vue开发基础入门教程Vue开发高级学习教程
  • 安装数据库首次应用 Array_06 javaoraclesql
    可是为什么再一次失败之后就变成直接跳过那个要求 enter full pathname of java.exe的界面 这个java.exe是你的Oracle 11g安装目录中例如：【F:\app\chen\product\11.2.0\dbhome_1\jdk\jre\bin】下的java.exe 。不是你的电脑安装的java jdk下的java.exe！ 注意第一次，使用SQL D
  • Weblogic Server Console密码修改和遗忘解决方法 bijian1013 Welogic
            在工作中一同事将Weblogic的console的密码忘记了，通过网上查询资料解决，实践整理了一下。 一.修改Console密码         打开weblogic控制台，安全领域 --> myrealm -->&n
  • IllegalStateException: Cannot forward a response that is already committed Cwind javaServlets
    对于初学者来说，一个常见的误解是：当调用 forward() 或者 sendRedirect() 时控制流将会自动跳出原函数。标题所示错误通常是基于此误解而引起的。 示例代码： protected void doPost() { if (someCondition) { sendRedirect(); } forward(); // Thi
  • 基于流的装饰设计模式 木zi_鸣 设计模式
    当想要对已有类的对象进行功能增强时，可以定义一个类，将已有对象传入，基于已有的功能，并提供加强功能。 自定义的类成为装饰类 模仿BufferedReader，对Reader进行包装，体现装饰设计模式 装饰类通常会通过构造方法接受被装饰的对象，并基于被装饰的对象功能，提供更强的功能。 装饰模式比继承灵活，避免继承臃肿，降低了类与类之间的关系 装饰类因为增强已有对象，具备的功能该
  • Linux中的uniq命令 被触发 linux
    Linux命令uniq的作用是过滤重复部分显示文件内容，这个命令读取输入文件，并比较相邻的行。在正常情 况下，第二个及以后更多个重复行将被删去，行比较是根据所用字符集的排序序列进行的。该命令加工后的结果写到输出文件中。输入文件和输出文件必须不同。如 果输入文件用“- ”表示，则从标准输入读取。 AD： uniq [选项] 文件 说明：这个命令读取输入文件，并比较相邻的行。在正常情况下，第二个
  • 正则表达式Pattern 肆无忌惮_ Pattern
    正则表达式是符合一定规则的表达式，用来专门操作字符串，对字符创进行匹配，切割，替换，获取。   例如，我们需要对QQ号码格式进行检验 规则是长度6~12位  不能0开头  只能是数字，我们可以一位一位进行比较，利用parseLong进行判断，或者是用正则表达式来匹配[1-9][0-9]{4,14} 或者 [1-9]\d{4,14} &nbs
  • Oracle高级查询之OVER (PARTITION BY ..) 知了ing oraclesql
    一、rank()/dense_rank() over(partition by ...order by ...) 现在客户有这样一个需求，查询每个部门工资最高的雇员的信息，相信有一定oracle应用知识的同学都能写出下面的SQL语句： select e.ename, e.job, e.sal, e.deptno from scott.emp e, (se
  • Python调试 矮蛋蛋 pythonpdb
    原文地址： http://blog.csdn.net/xuyuefei1988/article/details/19399137 1、下面网上收罗的资料初学者应该够用了，但对比IBM的Python 代码调试技巧： IBM：包括 pdb 模块、利用 PyDev 和 Eclipse 集成进行调试、PyCharm 以及 Debug 日志进行调试： http://www.ibm.com/d
  • webservice传递自定义对象时函数为空，以及boolean不对应的问题 alleni123 webservice
    今天在客户端调用方法 NodeStatus status=iservice.getNodeStatus(). 结果NodeStatus的属性都是null。 进行debug之后，发现服务器端返回的确实是有值的对象。 后来发现原来是因为在客户端，NodeStatus的setter全部被我删除了。 本来是因为逻辑上不需要在客户端使用setter， 结果改了之后竟然不能获取带属性值的
  • java如何干掉指针，又如何巧妙的通过引用来操作指针————>说的就是java指针 百合不是茶
    C语言的强大在于可以直接操作指针的地址，通过改变指针的地址指向来达到更改地址的目的,又是由于c语言的指针过于强大，初学者很难掌握， java的出现解决了c，c++中指针的问题 java将指针封装在底层，开发人员是不能够去操作指针的地址，但是可以通过引用来间接的操作：   定义一个指针p来指向a的地址（&是地址符号）：        
  • Eclipse打不开，提示“An error has occurred.See the log file ***/.log” bijian1013 eclipse
    打开eclipse工作目录的\.metadata\.log文件，发现如下错误： !ENTRY org.eclipse.osgi 4 0 2012-09-10 09:28:57.139 !MESSAGE Application error !STACK 1 java.lang.NoClassDefFoundError: org/eclipse/core/resources/IContai
  • spring aop实例annotation方法实现 bijian1013 javaspringAOPannotation
            在spring aop实例中我们通过配置xml文件来实现AOP，这里学习使用annotation来实现，使用annotation其实就是指明具体的aspect,pointcut和advice。1.申明一个切面(用一个类来实现)在这个切面里,包括了advice和pointcut AdviceMethods.jav
  • [Velocity一]Velocity语法基础入门 bit1129 velocity
    用户和开发人员参考文档 http://velocity.apache.org/engine/releases/velocity-1.7/developer-guide.html   注释 1.行级注释## 2.多行注释#*  *#   变量定义 使用$开头的字符串是变量定义，例如$var1, $var2,   赋值 使用#set为变量赋值，例
  • 【Kafka十一】关于Kafka的副本管理 bit1129 kafka
    1. 关于request.required.acks   request.required.acks控制者Producer写请求的什么时候可以确认写成功，默认是0， 0表示即不进行确认即返回。 1表示Leader写成功即返回，此时还没有进行写数据同步到其它Follower Partition中 -1表示根据指定的最少Partition确认后才返回，这个在   Th
  • lua统计nginx内部变量数据 ronin47 lua nginx　 统计
    server { listen 80; server_name photo.domain.com; location /{set $str $uri; content_by_lua ' local url = ngx.var.uri local res = ngx.location.capture(
  • java-11.二叉树中节点的最大距离 bylijinnan java
    import java.util.ArrayList; import java.util.List; public class MaxLenInBinTree { /* a. 1 / \ 2 3 / \ / \ 4 5 6 7 max=4 pass "root"
  • Netty源码学习-ReadTimeoutHandler bylijinnan javanetty
    ReadTimeoutHandler的实现思路： 开启一个定时任务，如果在指定时间内没有接收到消息，则抛出ReadTimeoutException 这个异常的捕获，在开发中，交给跟在ReadTimeoutHandler后面的ChannelHandler，例如 private final ChannelHandler timeoutHandler = new ReadTim
  • jquery验证上传文件样式及大小(好用) cngolon 文件上传jquery验证
    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script src="jquery1.8/jquery-1.8.0.
  • 浏览器兼容【转】 cuishikuan css浏览器IE
    浏览器兼容问题一：不同浏览器的标签默认的外补丁和内补丁不同 问题症状：随便写几个标签，不加样式控制的情况下，各自的margin 和padding差异较大。 碰到频率:100% 解决方案：CSS里    *{margin:0;padding:0;} 备注：这个是最常见的也是最易解决的一个浏览器兼容性问题，几乎所有的CSS文件开头都会用通配符*来设
  • Shell特殊变量：Shell $0, $#, $*, $@, $?, $$和命令行参数 daizj shell$#$?特殊变量
    前面已经讲到，变量名只能包含数字、字母和下划线，因为某些包含其他字符的变量有特殊含义，这样的变量被称为特殊变量。例如，$ 表示当前Shell进程的ID，即pid，看下面的代码： $echo $$ 运行结果 29949   特殊变量列表 变量 含义 $0 当前脚本的文件名 $n 传递给脚本或函数的参数。n 是一个数字，表示第几个参数。例如，第一个
  • 程序设计KISS 原则-------KEEP IT SIMPLE, STUPID! dcj3sjt126com unix
    翻到一本书，讲到编程一般原则是kiss：Keep It Simple, Stupid.对这个原则深有体会，其实不仅编程如此，而且系统架构也是如此。 KEEP IT SIMPLE, STUPID! 编写只做一件事情，并且要做好的程序；编写可以在一起工作的程序，编写处理文本流的程序，因为这是通用的接口。这就是UNIX哲学.所有的哲学真 正的浓缩为一个铁一样的定律，高明的工程师的神圣的“KISS 原
  • android Activity间List传值 dcj3sjt126com Activity
    第一个Activity： import java.util.ArrayList;import java.util.HashMap;import java.util.List;import java.util.Map;import android.app.Activity;import android.content.Intent;import android.os.Bundle;import a
  • tomcat 设置java虚拟机内存 eksliang tomcat 内存设置
    转载请出自出处：http://eksliang.iteye.com/blog/2117772 http://eksliang.iteye.com/ 常见的内存溢出有以下两种: java.lang.OutOfMemoryError: PermGen space java.lang.OutOfMemoryError: Java heap space   ------------
  • Android 数据库事务处理 gqdy365 android
    使用SQLiteDatabase的beginTransaction()方法可以开启一个事务，程序执行到endTransaction() 方法时会检查事务的标志是否为成功，如果程序执行到endTransaction()之前调用了setTransactionSuccessful() 方法设置事务的标志为成功则提交事务，如果没有调用setTransactionSuccessful() 方法则回滚事务。事
  • Java 打开浏览器 hw1287789687 打开网址open浏览器open browser打开url打开浏览器
    使用java 语言如何打开浏览器呢? 我们先研究下在cmd窗口中,如何打开网址 使用IE 打开 D:\software\bin>cmd /c start iexplore http://hw1287789687.iteye.com/blog/2153709 使用火狐打开 D:\software\bin>cmd /c start firefox http://hw1287789
  • ReplaceGoogleCDN：将 Google CDN 替换为国内的 Chrome 插件 justjavac chromeGooglegoogle apichrome插件
    Chrome Web Store 安装地址： https://chrome.google.com/webstore/detail/replace-google-cdn/kpampjmfiopfpkkepbllemkibefkiice 由于众所周知的原因，只需替换一个域名就可以继续使用Google提供的前端公共库了。 同样，通过script标记引用这些资源，让网站访问速度瞬间提速吧
  • 进程VS.线程 m635674608 线程
    资料来源： http://www.liaoxuefeng.com/wiki/001374738125095c955c1e6d8bb493182103fac9270762a000/001397567993007df355a3394da48f0bf14960f0c78753f000 1、Apache最早就是采用多进程模式 2、IIS服务器默认采用多线程模式 3、多进程优缺点 优点： 多进程模式最大
  • Linux下安装MemCached 字符串 memcached
    前提准备：1. MemCached目前最新版本为：1.4.22，可以从官网下载到。2. MemCached依赖libevent，因此在安装MemCached之前需要先安装libevent。2.1 运行下面命令，查看系统是否已安装libevent。[root@SecurityCheck ~]# rpm -qa|grep libevent libevent-headers-1.4.13-4.el6.n
  • java设计模式之--jdk动态代理（实现aop编程） Supanccy2013 javaDAO设计模式AOP
        与静态代理类对照的是动态代理类，动态代理类的字节码在程序运行时由Java反射机制动态生成，无需程序员手工编写它的源代码。动态代理类不仅简化了编程工作，而且提高了软件系统的可扩展性，因为Java 反射机制可以生成任意类型的动态代理类。java.lang.reflect 包中的Proxy类和InvocationHandler 接口提供了生成动态代理类的能力。 &
  • Spring 4.2新特性-对java8默认方法(default method)定义Bean的支持 wiselyman spring 4
    2.1 默认方法(default method) java8引入了一个default medthod; 用来扩展已有的接口,在对已有接口的使用不产生任何影响的情况下,添加扩展 使用default关键字 Spring 4.2支持加载在默认方法里声明的bean 2.2 将要被声明成bean的类 public class DemoService {
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他