铁雪资源网 Design By www.gsvan.com
本文实例讲述了jQuery实现带有洗牌效果的动画分页。分享给大家供大家参考。具体如下:
这款jquery分页示例载入的是一个图片的LI列表,使用jQuery技术将其分为多页显示,在分页的过程中,还加入了动画效果,使整个分页效果看上去很有专业味。
运行效果截图如下:
在线演示地址如下:
http://demo.jb51.net/js/2015/jquery-list-page-flash-style-codes/
具体代码如下:
<!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> <title>jquery分页</title> <style> html,body,div,ul,li,img,button{ padding:0; margin:0; } body{ background:#333; } img{ width:150px; height:150px; outline:none; margin:5px; vertical-align:middle; } #wrapBox{ width:1150px; height:630px; border:1px solid #000; background:#E7E7E7; margin:30px 0 0 65px; position:relative; } ul{ position:relative; } ul li{ width:160px; height:160px; list-style:none; position:absolute; background:#FFF; } #button{ position:absolute; left:525px; top:580px; } #button button{ width:43px; height:43px; background:url('') no-repeat 2px; cursor:pointer; color:#666; font-weight:bolder; font-size:larger; border:none; } #button button.click{ color:#A80000; } </style> <script type="text/javascript" src="/UploadFiles/2021-04-02/jquery-1.6.2.min.js">希望本文所述对大家的jquery程序设计有所帮助。
标签:
jQuery,洗牌效果,动画分页
铁雪资源网 Design By www.gsvan.com
广告合作:本站广告合作请联系QQ:858582 申请时备注:广告合作(否则不回)
免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件! 如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件! 如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
铁雪资源网 Design By www.gsvan.com
暂无jQuery实现带有洗牌效果的动画分页实例的评论...