QQ空间顶部折页撕开效果示例代码


Posted in Javascript onJune 15, 2014

效果:
QQ空间顶部折页撕开效果示例代码 
HTML:

<div id="pageflip"> 
<a target="_blank" href="http://www.sparkdesign.cn/"><img width="307" height="319" src="js/page_flip.png" style="overflow: hidden; width: 50px; display: block; height: 52px;"></a> 
<div class="msg_block" style="overflow: hidden; width: 50px; display: block; height: 50px;"></div> 
</div>

JS:
$(document).ready(function(){ $("#pageflip").hover(function(){ 
$("#pageflip img , .msg_block").stop().animate({width: '307px', height: '319px'}, 500); 
},function(){ 
$("#pageflip img").stop().animate({width: '50px', height: '52px'}, 220); 
$(".msg_block").stop().animate({width: '50px', height: '50px'}, 200); 
}); 
});
Javascript 相关文章推荐
Add a Picture to a Microsoft Word Document
Jun 15 Javascript
一个分享按钮的插件使用介绍(可扩展,内附开发制作流程)
Sep 19 Javascript
javascript html5实现表单验证
Mar 01 Javascript
JavaScript实现数组降维详解
Jan 05 Javascript
jquery实现弹窗功能(窗口居中显示)
Feb 27 Javascript
node.js中路由,中间件,ge请求和post请求的参数详解
Dec 26 Javascript
vue scroller返回页面记住滚动位置的实例代码
Jan 29 Javascript
jQuery实现常见的隐藏与展示列表效果示例
Jun 04 jQuery
JavaScript高级函数应用之分时函数实例分析
Aug 03 Javascript
vue+layui实现select动态加载后台数据的例子
Sep 20 Javascript
JavaScript 实现HTML DOM增删改查操作的常见方法详解
Jan 04 Javascript
jQuery Datatables 动态列+跨列合并实现代码
Jan 30 jQuery
js中通过父级进行查找定位元素
Jun 15 #Javascript
js判断浏览器类型为ie6时不执行
Jun 15 #Javascript
给应用部分的js代码设定一个统一的入口
Jun 15 #Javascript
javascript 寻找错误方法整理
Jun 15 #Javascript
extjs每个组件要设置唯一的ID否则会出错
Jun 15 #Javascript
理运用命名空间让js不产生冲突避免全局变量的泛滥
Jun 15 #Javascript
jQuery获取动态生成的元素示例
Jun 15 #Javascript
You might like
SONY ICF-SW07收音机电路分析
2021/03/02 无线电
Gregarius中文日期格式问题解决办法
2008/04/22 PHP
解读PHP中的垃圾回收机制
2015/08/10 PHP
JS 获取浏览器和屏幕宽高等信息的实现思路及代码
2013/07/31 Javascript
jquery ajax对特殊字符进行转义防止js注入使用示例
2013/11/21 Javascript
一个JavaScript用逗号分割字符串实例
2014/09/22 Javascript
js代码验证手机号码和电话号码是否合法
2015/07/30 Javascript
基于ExtJs在页面上window再调用Window的事件处理方法
2017/07/26 Javascript
vue获取dom元素注意事项
2017/12/28 Javascript
使用vue.js在页面内组件监听scroll事件的方法
2018/09/11 Javascript
自己动手封装一个React Native多级联动
2018/09/19 Javascript
layui添加动态菜单与选项卡 AJAX请求的例子
2019/09/25 Javascript
解决vue.js提交数组时出现数组下标的问题
2019/11/05 Javascript
微信小程序wxml列表渲染原理解析
2019/11/27 Javascript
vue css 引入asstes中的图片无法显示的四种解决方法
2020/03/16 Javascript
Vue项目配置跨域访问和代理proxy设置方式
2020/09/08 Javascript
[01:07:15]DOTA2-DPC中国联赛 正赛 DLG vs XG BO3 第二场 1月25日
2021/03/11 DOTA
Python数组定义方法
2016/04/13 Python
Python设计模式之抽象工厂模式
2016/08/25 Python
Python新手入门最容易犯的错误总结
2017/04/24 Python
python使用opencv驱动摄像头的方法
2018/08/03 Python
pycharm远程开发项目的实现步骤
2019/01/20 Python
pycharm修改file type方式
2019/11/19 Python
html5的新玩法——语音搜索
2013/01/03 HTML / CSS
英国在线购买轮胎、预订汽车、汽车维修和装配网站:Protyre
2020/04/12 全球购物
经济学博士求职自荐信范文
2013/11/23 职场文书
医药工作岗位求职信分享
2013/12/31 职场文书
铁路工务反思材料
2014/02/07 职场文书
致接力运动员广播稿
2014/02/17 职场文书
学校消防安全责任书
2014/07/23 职场文书
2014年环卫工作总结
2014/11/22 职场文书
2014年学前班工作总结
2014/12/08 职场文书
朝花夕拾读书笔记
2015/06/29 职场文书
创业计划书之宠物店
2019/09/19 职场文书
PhpSpreadsheet中文文档 | Spreadsheet操作教程实例
2021/04/01 PHP
python实现进度条的多种实现
2021/04/29 Python