- 浏览: 54289 次
- 性别:
- 来自: 苏州
文章分类
- 全部博客 (32)
- java (2)
- js (8)
- jquery (4)
- 随便说说 (4)
- Database, SQL (1)
- html (1)
- toolkit (2)
- python (2)
- django (2)
- helper (2)
- cookies (3)
- git (0)
- javascript基础 (1)
- hibernate (0)
- ibatis (0)
- 网上支付 (0)
- openstack (0)
- Mac (1)
- MySQL (1)
- linux (1)
- Postgresql (0)
- J2EE (0)
- 设计模式 (0)
- 面向对象 (0)
- hadoop (1)
- ubuntu (0)
- UML (0)
- Oracle (0)
- virtualbox (0)
- esb (0)
- mybatis (0)
- translate (0)
- struts2 api (1)
- jquery-ui (0)
- spring (0)
- jquery validation (0)
- web (0)
- spring mybatis (0)
- 单元测试 (0)
- eclipse (0)
- maven (0)
- java junit (0)
- editplus (0)
- jpa (0)
- jpa hibernate (1)
- sql (0)
- jpql (0)
- 杂 (0)
- shiro (0)
- filter (0)
- junit (1)
- tomcat (0)
- struts2 (1)
- spring-data jpa (0)
- ImageIO jpg (0)
- cms (0)
- php (0)
- node js (0)
- NodeJS (1)
- keystone (0)
- sublime (1)
- aws ec2 (0)
- pdf (0)
- design pattern (0)
- 条件查询(Criteria Queries) (0)
- jenkins (0)
- bootstrap (0)
- springside (0)
- apache (0)
最新评论
-
tokyo2006:
不错,经验之谈是最好的
收集记录一些在使用Python、Django中遇到的问题及解决方法 -
zhuchao_ko:
自己写的操作等待浮出层
在网上找到了一个实现“ 随滚动条滚动居中效果 ”的jQuery插件,感觉很有用,故收藏下来。
随滚动居中的效果,平时都会经常使用到,于是写成一个 jQuery 的插件。同时,这是我写的第一个插件。呵呵。纪念一下。
该插件可以令所选择的 Elements 永远浮动在窗口中央,无论是滚动还是窗口的大小发生改变。
代码
(function($){ $.fn.extend({ // 兼容不同的浏览器取得窗口的大小 getWindowSize: function(){ if($.browser.opera){ return {width: window.innerWidth, height: window.innerHeight}; } return {width: $(window).width(), height: $(window).height()}; }, // 主函数 scrollCenter: function(options){ // 扩展参数 var op = $.extend({ z: 1000000 }, options); // 追加到 document.body 并设置其样式 var windowSize = this.getWindowSize(); this.appendTo(document.body).css({ 'position': 'absolute', 'z-index': op.z, 'top': (windowSize.height - this.height())/2+$(window).scrollTop() + 'px', 'left': (windowSize.width - this.width())/2+$(window).scrollLeft() + 'px' }); // 保存当前位置参数 var bodyScrollTop = $(document).scrollTop(); var bodyScrollLeft = $(document).scrollLeft(); var movedivTop = this.offset().top; var movedivLeft = this.offset().left; var thisjQuery = this; // 滚动事件 $(window).scroll(function(e){ var tmpBodyScrollTop = $(document).scrollTop(); var tmpBodyScrollLeft = $(document).scrollLeft(); movedivTop += tmpBodyScrollTop - bodyScrollTop; movedivLeft += tmpBodyScrollLeft - bodyScrollLeft; bodyScrollTop = tmpBodyScrollTop; bodyScrollLeft = tmpBodyScrollLeft; // 以动画方式进行移动 thisjQuery.stop().animate({ 'top': movedivTop + 'px', 'left': movedivLeft + 'px' }); }); // 窗口大小重设事件 $(window).resize(function(){ var windowSize = thisjQuery.getWindowSize(); movedivTop = (windowSize.height - thisjQuery.height())/2+$(document).scrollTop(); movedivLeft = (windowSize.width - thisjQuery.width())/2+$(document).scrollLeft(); thisjQuery.stop().animate({ 'top': movedivTop + 'px', 'left': movedivLeft + 'px' }); }); return this; } }); })(jQuery);
使用方法
$(selector).scrollCenter(); $(selector).scrollCenter({z:1000000});
参数 z 是设置其 z-index(默认设为1000000),以免被其它的层所遮盖。
发表评论
-
jquery工具
2014-06-12 10:01 0单元测试 http://qunitjs.com/ -
基于jquery的回到顶部插件
2014-06-12 09:15 0/** * 回到顶部功能 */ (function ... -
jquery 插件
2014-06-03 18:06 0jquery 插件 http://dhtmlx.com/ ... -
jquery ui dialog 扩展
2014-06-03 16:04 0jquery ui dialog 扩展 -
jquery固定头部插件
2014-05-22 11:09 0jquery固定头部插件 https:// ... -
jquery cookie 插件
2014-05-18 13:54 0jquery.cookie 使用方法 http://www ... -
jquery validation插件
2014-04-28 14:55 0api http://banu.blog.163.com/ ... -
jquery 1.9.1变更
2014-04-11 15:57 0.live() ->.on jQuery中li ... -
jquery plugin
2014-01-07 11:32 0jquery ui http://api.jqueryu ... -
解决了jquery.bgiframe.min.js的一个bug (jquery.bgiframe.min.js, line 10 character 978)
2012-02-01 15:31 3568解决了jquery.bgiframe.min.js的一个bug ... -
收集记录一些使用Javascript,JQuery时遇到的问题
2011-12-28 11:04 1039收集记录一些使用Javascript,JQuery时遇到的问题 ... -
table.panel - 自己写的用于table行操作的jquery插件
2011-06-02 10:51 1703table.panel是基于jquery开发的用于table的 ...
相关推荐
转帖:Android应用的自动升级、更新模块的实现docx.docx
NULL 博文链接:https://abe.iteye.com/blog/998758
一,LCD主要技术指标;二 电路工作原理提要;三 检修提要
我的职场十年,IT人很值得借鉴呀!!!!!!!!!!!!!!!!!!!!!!!!!!!!
今天教大家用jquery语言制作下拉菜单--本教程已解决了jquery的 hover 滑动菜单晃动问题,大家可以参照本例源码制作。(转帖请注明:来自中山大学数计学院网页设计培训中心。)
论坛转帖工具 .......... 纯HTML
转帖:讲述OPTISYSTEM基础知识,适合新手学习!
一键转帖 一键8经验签到. 绿易贴吧工具3.7 11.11版.rar
编辑人员转帖去水印工具,很好用,直接选中水印区域后运行伪装即可!
atx电源电路图下载 AT电源只要能把电源打开就行了,可现在的ATX电源都是电位控制开关而非机械开关,这就需要从电源的那一排查线孔...转帖:http://www.jdwx.info/thread-270610-1-1.html [家电维修论坛](www.jdwx.info)
转帖:本项目是一个聊天机器人的小例子,使用的图灵(www.tuling123.com)提供的聊天api,javaapk之前也发布过一个聊天机器人http://www.javaapk.com/source/1488.html,现在的问答机器人只能分析关键字做一个简单的...
转帖性能测试
UBB论坛转帖圣手.exeUBB论坛转帖圣手.exe
discuz X2转帖工具、采集工具,discuz论坛批量发帖,批量转帖工具
转帖图片提取工具可以对论坛图片附件信息进行清除,只保留图片代码,操作很简单,推荐有需要转帖图片工具的朋友下载 转帖图片提取工具使用方法: 将IP138上处理过的东西复制到上方的编辑框内,点击只要图片,下面...
这是一个世界编程大赛第一名写的程序,很好玩的,大家试试看。
1.修改自Convert X转帖工具 2.新增批量替换关键词(原来是单个词语替换,可以利用这个功能删除一些网站的防转帖代码) 3.批量随机新增文字(新增内容可自定义,从而实现伪原创) 4.cookie记录替换和新增关键词(避免每次...
比较全面的网摘收藏和SNS分享代码,复制粘贴到你的网页中即可使用,可丰富你的网页体验,为用户创造便利条件。 转发至人人网" charset="400-03-... 分数可能有点高,这个和一般的优酷分享都差不多。但是我个人觉得值。
Html2UBBMaxcj_Softii论坛专用转帖工具