bootstrap jquery.slimscroll

效果图

bootstrap jquery.slimscroll_第1张图片

code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<link href="/CERPGIS/gis/media/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
<link rel="stylesheet" href="/CERPGIS/gis/media/css/bootstrap-table.css">
<link href="/CERPGIS/gis/media/css/font-awesome.min.css" rel="stylesheet" type="text/css"/>
<script src="/CERPGIS/gis/media/js/jquery-1.11.2.min.js" type="text/javascript"></script>
<script src="/CERPGIS/gis/media/js/jquery-ui-1.10.1.custom.min.js" type="text/javascript"></script>      
	<script src="/CERPGIS/gis/media/js/bootstrap.min.js" type="text/javascript"></script>
<script src="/CERPGIS/gis/media/js/jquery.slimscroll.min.js" type="text/javascript"></script>
	<script src="/CERPGIS/gis/media/js/bootstrap-table.js"></script>
	<!-- 初始化配置 -->
<!-- 	<script src="/CERPGIS/gis/media/js/app.js"></script> -->
	<script>
		$(function() { 
// 		   App.init();//页面初始化
console.log($("#scroller"));
		 $("#scroller").slimScroll({
             size: '7px',
             color: '#a1b2bd',
//              position: isRTL ? 'left' : 'right',
             height: $(this).attr("data-height"),
             alwaysVisible: ($(this).attr("data-always-visible") == "1" ? true : false),
             railVisible: ($(this).attr("data-rail-visible") == "1" ? true : false),
             disableFadeOut: true
         });
		});
	</script>
</head>
<body>
<div id="scroller" class="scroller" data-height="290px" data-always-visible="1" data-rail-visible="0">
	<table id="test" data-toggle="table" data-url="/CERPGIS/gis/data1.json" data-show-header="true" data-cache="false">
	    <thead>
	        <tr>
	            <th data-field="id">id</th>
	            <th data-field="name">姓名</th>
	            <th data-field="price">房间号</th>
	        </tr>
	    </thead>
	</table>
</div>
</body>
</html>
简介:

bootstrap jquery.slimscroll_第2张图片

你可能感兴趣的:(jquery,bootstrap)