获取各种高度 等H5页面笔记

获取各种高度 等H5页面笔记,第1张

网页可见区域宽: document.body.clientWidth

网页可见区域高: document.body.clientHeight

网页可见区域宽: document.body.offsetWidth (包括边线的宽)

网页可见区域高: document.body.offsetHeight (包括边线的高)

网页正文全文宽: document.body.scrollWidth

网页正文全文高: document.body.scrollHeight

网页被卷去的高: document.body.scrollTop

网页被卷去的左: document.body.scrollLeft

网页正文部分上: window.screenTop

网页正文部分左: window.screenLeft

屏幕分辨率的高: window.screen.height

屏幕分辨率的宽: window.screen.width

屏幕可用工作区高度: window.screen.availHeight

屏幕可用工作区宽度: window.screen.availWidth

`font-family: PingFang SC,STHeitiSC-Light,Helvetica-Light,arial,sans-serif,Droid Sans Fallback

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">

<body onselectstart="return false">

white-space: pre-wrap

-webkit-tap-highlight-color: transparent

注意到“pre-wrap”属性值:保留空白符序列,但是正常地进行换行。

white-space:pre-wrap

filter: brightness(100)变白

第二行变第一行不变

body{}

小程序上fixed成功过

一般这种都让ios或者安卓端禁止掉,然后在有d性需求的页面添加样式

overflow-y: scroll

-webkit-overflow-scrolling : touch

即可

-webkit-overflow-scrolling: touch

//小程序 h5 交互

touches: 当前屏幕上所有触摸点的列表

targetTouches: 当前对象上所有触摸点的列表

changedTouches: 涉及当前(引发)事件的触摸点的列表

通过一个例子来区分一下触摸事件中的这三个属性:

1. 用一个手指接触屏幕,触发事件,此时这三个属性有相同的值。

2. 用第二个手指接触屏幕,此时,touches有两个元素,每个手指触摸点为一个值。当两个手指触摸相同元素时,targetTouches和touches的值相同,否则targetTouches 只有一个值。changedTouches此时只有一个值,

为第二个手指的触摸点,因为第二个手指是引发事件的原因

3. 用两个手指同时接触屏幕,此时changedTouches有两个值,每一个手指的触摸点都有一个值

4. 手指滑动时,三个值都会发生变化

5. 一个手指离开屏幕,touches和targetTouches中对应的元素会同时移除,而changedTouches仍然会存在元素。

6. 手指都离开屏幕之后,touches和targetTouches中将不会再有值,changedTouches还会有一个值,

此值为最后一个离开屏幕的手指的接触点。

3.touchmove事件对象的获取

想要在touchmove:function(e,参数一)加一个参数,结果直接使用e.preventDefault()就会 e 报错,处理方法为使用arguments[0]获取event参数

touchmove:function(e,参数一){

var e=arguments[0]

e.preventDefault()

}

webpack-config dev-server 添加disableHostCheck: true,

html的font-size还没设置的时候展示的样式是错误的

//打开背景图

$image = \think\Image::open('二维码图片路径')

//字体路径

$path=ROOT_PATH.'public/font/PingFang-Bold-1.ttf'

$path1=ROOT_PATH.'public/font/PingFang Regular.ttf'

//海报存储路径

$file='二维码加水印后的图片存储路径'

//给背景图加文字和图片水印

$image->text($order_id,$path,20,'#000000',array(200,470))

->water($hecode,array(190,160)) //图片水印

->text('请向收银员出示',$path,20,'#000000',array(240,510)) //文字水印

->text('名称',$path,20,'#4C4C4C',array(80,760))

->text($name,$path1,18,'#000000',array(475,760))

->save('hecode/'.$param.'text_image.png')

return $file


欢迎分享,转载请注明来源:内存溢出

原文地址:https://54852.com/yw/11560520.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2023-05-17
下一篇2023-05-17

发表评论

登录后才能评论

评论列表(0条)

    保存