会python真的可以为所欲为0(回)
398天前
这里还有人吗1(回)
583天前这里还有人吗0(回)
583天前
每天面对着电脑屏幕，敲打键盘。我所面对的并不只是代码，而是一种生活方式。0(回)
807天前到处都是羊，不想上班0(回)
887天前
鸽子
0(回)
892天前
jQuery+css带阴影的撕页广告效果.rar(免费下载)[2 次下载]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> |
<html xmlns="http://www.w3.org/1999/xhtml"> |
<head> |
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> |
<title>jQuery+css带阴影的撕页广告效果</title> |
<link href="css/styles.css" type=text/css rel=stylesheet> |
<SCRIPT src="js/jquery-latest.js" type=text/javascript></SCRIPT> |
<SCRIPT type=text/javascript> |
$(document).ready(function(){ |
//Page Flip on hover |
$("#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); |
}); |
|
}); |
</SCRIPT> |
<STYLE type=text/css> |
IMG { |
BEHAVIOR: url(iepngfix.htc) |
} |
#pageflip { |
RIGHT: 0px; |
FLOAT: right; |
POSITION: relative; |
TOP: 0px |
} |
#pageflip IMG { |
Z-INDEX: 99; |
RIGHT: 0px; |
WIDTH: 50px; |
POSITION: absolute; |
TOP: 0px; |
HEIGHT: 52px; |
ms-interpolation-mode: bicubic |
} |
#pageflip .msg_block { |
RIGHT: 0px; |
BACKGROUND: url(images/subscribe.png) no-repeat right top; |
OVERFLOW: hidden; |
WIDTH: 50px; |
POSITION: absolute; |
TOP: 0px; |
HEIGHT: 50px |
} |
</STYLE> |
</head> |
<body id=home> |
<div id=pageflip><A href="http://www.jb51.net" target="_blank"><IMG src="images/page_flip.png"></A> |
<div class=msg_block></div> |
</div> |
<center> |
<p> </p> |
<p> </p> |
<p> </p> |
<p></p> |
<p> |
<p>这种效果常被应用在网页广告中，不影响网页内容，而且用户关注度高，网站上很多叫做撕页广告或者翻页广告，也可以叫书角广告。</p> |
<p>使用方法：</p> |
<p>打开index.html</p> |
<p>1 #pageflip img , .msg_block 广告展开后图片大小请修改后面的数值。</p> |
<p>2 #pageflip img 广告展开前图片大小，请修改后面的数值。</p> |
<p>3 .msg_block 广告展示后图片的大小，请修改后面对应的数值。</p> |
<p> </p> |
<p> </p> |
</p> |
<p></p> |
</center> |
</body> |
</html> |
jQuery+css带阴影的撕页广告效果.rar(免费下载)[2 次下载]
