老张小站

  1. 欢迎光临

    感谢访问老张的博客!

  • 1
845

ckplayer 手机端优化,解决控制条无法呼出、LOGO边距过大问题

分类 网站技术/村民张先生 发布于 2019-10-27 17:34
0

主要解决以下问题:

1、解决控制条自动隐藏后无法再呼出的问题(修改为不自动隐藏控制条,并将控制条下移38px,使之常显但不遮挡视频画面)。

复制 ckplayer.js 为 ckplayer.mobile.js ,手机版独立调用 ckplayer.mobile.js 。

查找:

click: true,

修改为:

click: false,

查找:

this.controlBarIsShow = true;

修改为:

this.controlBarIsShow = false;

查找:

this.controlBarHide();

注释掉:

//this.controlBarHide();

查找:

playerDiv.className = playerID;

在其下方增加:

playerDiv.style.cssText = "padding-bottom:38px;";

2、解决右上角LOGO在手机端显示过大的问题。

首先单独做一个缩小版的手机端LOGO,替换掉 ckplayer.mobile.js 中的原有LOGO。

接着解决边距过大问题。

查找:

this.getByElement(logoID).innerHTML = '<img src="' + logoFile + '" border="0">';

替换为(具体数值自行调试):

this.getByElement(logoID).innerHTML = '<img src="' + logoFile + '" border="0" style="margin-top:-20px">';

查找:

				height: '30px',
				lineHeight: '30px',
				color: '#FFFFFF',
				fontFamily: 'Arial',
				fontSize: '28px',
				textAlign: 'center',
				position: 'absolute',
				float: 'left',
				left: '-1000px',
				top: '20px',
				zIndex: '996',
				filter: 'alpha(opacity:0.8)',
				opacity: '0.8',
				cursor: 'default'

替换为:

				position: 'absolute',
				float: 'left',
				left: '-1000px',
				zIndex: '901',
				filter: 'alpha(opacity:0.8)',
				opacity: '0.8',
				cursor: 'default'

查找:

					left: parseInt(this.PD.offsetWidth - this.CB['logo'].offsetWidth - 20) + 'px',
					top: '20px'

替换为:

					left: parseInt(this.PD.offsetWidth - this.CB['logo'].offsetWidth - 2) + 'px',
					top: '10px'
欢迎转载分享,转载请注明 来源:大张小站 https://www.zhang.cq.cn/20192181.html
若您喜欢这篇文章,欢迎订阅老张小站以获得最新内容。 / 欢迎交流探讨,请发电子邮件至 mail[at]vdazhang.com 。


欢迎谈谈你的看法(无须登录) *正文中请勿包含"http://"否则将被拦截