手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >QQ空间顶部折页撕开效果示例代码
QQ空间顶部折页撕开效果示例代码
摘要:效果:HTML:复制代码代码如下:JS:复制代码代码如下:$(document).ready(function(){$("#pageflip...

效果:

1

HTML:

复制代码 代码如下:

<div id="pageflip">

<a target="_blank" href="http://www.sparkdesign.cn/"><img width="307" height="319" src="js/page_flip.png"></a>

<div></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);

});

});

【QQ空间顶部折页撕开效果示例代码】相关文章:

基于JavaScript实现动态添加删除表格的行

设为首页 加入收藏的js代码

网页里控制图片大小的相关代码

简单的防盗链功能代码(iframe)

jQuery基于图层模仿五星星评价功能的方法

获得当前页面URL地址的三个JS代码

新页面打开实际尺寸的图片

基于jQuery实现的无刷新表格分页实例

javascript原型模式用法实例详解

jQuery实现返回顶部效果的方法

精品推荐
分类导航