更改datatables的分页切换时的'processing'提示信息的式样

最新推荐文章于 2020-04-19 12:15:51 发布

zhao1949

最新推荐文章于 2020-04-19 12:15:51 发布

阅读量2.5k

点赞数

CC 4.0 BY-SA版权

分类专栏： javascript 文章标签： javascript

本文链接：https://blog.youkuaiyun.com/zhao1949/article/details/73770006

javascript 专栏收录该内容

19 篇文章

订阅专栏

本文介绍如何使用jQuery DataTables插件自定义加载时的样式，包括定位、尺寸及背景渐变效果等细节调整，适用于希望改善用户体验的前端开发者。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

jquery.dataTables.css

.dataTables_wrapper .dataTables_processing {
  position: absolute;
  top: 50%;
  left: 50%;
/*   width: 100%; */
  width: 100px
  height: 40px;
  margin-left: -50%;
  margin-left: auto;
  margin-right: auto;
  margin-top: -25px;
  padding-top: 20px;
  text-align: center;
  font-size: 1.2em;
/*   background-color: #ccc; */
/*   background-color: white; */
/*   background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(25%, rgba(255, 255, 255, 0.9)), color-stop(75%, rgba(255, 255, 255, 0.9)), color-stop(100%, rgba(255, 255, 255, 0))); */
/*   background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%); */
/*   background: -moz-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%); */
/*   background: -ms-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%); */
/*   background: -o-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%); */
/*   background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%); */
}

	function _fnProcessingDisplay ( settings, show )
	{
		if ( settings.oFeatures.bProcessing ) {
//			console.log("settings.aanFeatures.r="+settings.aanFeatures.r);
			$(settings.aanFeatures.r).css( 'display', show ? 'block' : 'none' );
//			$(settings.aanFeatures.r).css( "background-color","#ccc");
//			$(settings.aanFeatures.r).width("100px");
		}
	
		_fnCallbackFire( settings, null, 'processing', [settings, show] );
	}