jquery.abScrollBars实现页面内模拟滚动条效果代码
代码语言:html
所属分类:加载滚动
代码描述:页面内模拟滚动条
代码标签: jquery.abScrollBars 页面 模拟 滚动条
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta content="text/html; charset=utf-8" http-equiv="Content-Type"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <style type="text/css"> *{margin:0;padding:0}body{background:#0c91e8;font-size:12px;color:#333}ul,li{list-style:none}p{word-wrap:break-word}img{border:0;vertical-align:middle}a{color:#eef7fe;text-decoration:none}a:hover{color:#fff;text-decoration:none} </style> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/jquery.1.11.min.js"></script> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/jquery.abScrollBar-v1.2.min.js"></script> </head> <body> <div style="text-align:center;padding:100px 0 150px 0;"> <div class="logo z"> <h2 style="color:#ebf7fe;font-size:38px;line-height:50px;font-weight:bold;font-style:italic;"><a href="HttP://www.bootstrapmb.com" title="abScrollBar v1.0" target="_blank">abScrollBar</a></h2> <p style="font-size:13px;font-style:italic;color:#ddf0fb;">页面内模拟滚动条 v1.2</p> </div> </div> <style type="text/css"> .abScrollBar-main{width:320px;height:465px;margin:0 auto;background:#fff;border:1px solid #fff;border-radius:30px}.abScrollBar-box{width:320px;height:400px;margin:30px 0 0 0;background:#fff;overflow:hidden;position:relative}.abScrollBar-box .content{color:#555;padding:0 30px}.abScrollBar-box .content p{line-height:24px;font-size:14px;padding:15px 0;text-indent:2em;border-bottom:1px solid #f5f5f5}.abScrollBar-box .bar-bg{background:#fafafa}.abScrollBar-box .bar{background:#4ad585} </style> <div class="abScrollBar-main">.........完整代码请登录后点击上方下载按钮下载查看
网友评论0