H5页面制作兼容显示的方法、装置、终端设备及存储介质制造方法及图纸
【技术实现步骤摘要】
H5页面制作兼容显示的方法、装置、终端设备及存储介质
本专利技术涉及H5页面制作领域，尤其涉及一种H5页面制作兼容显示的方法、装置、终端设备及存储介质。
技术介绍
H5页面是指基于HTML5制作的页面。HTML5的设计目的是为了在移动设备上支持多媒体，新的语法特征被引进以支持这一点，如video、audio和canvas标记。HTML5还引进了新的功能，可以真正改变用户与文档的交互方式。由于HTML5赋予了网页更好的意义和结构，因此基于HTML5开发的H5页面也越来越广泛地应用在招聘宣传、新品宣传、活动宣传、活动抽奖，活动投票等场景下。许多公司看到了其中的商机，H5页面制作工具如雨后春笋般涌现出来。在利用H5页面制作工具制作H5页面的过程中，由于需要考虑到不同机型的手机的尺寸问题，因此需要对页面元素的摆放位置进行调整，以避免某些位于页面边缘的页面元素无法完全显示。现有技术一般有如下两种解决方案：第一种方案如图1所示，直接在元素信息中，观察最下方元素的位置和尺寸信息，根据不同机型的手机屏幕的长宽的不同比例，自行计算后调整元素位置；第二种方案是在H5页面显示时使用长页...
【技术保护点】
一种H5页面制作兼容显示的方法，其特征在于，包括以下步骤：检测被选中的元素；当监听到移动所述元素的事件时，实时获取所述元素在页面中的位置；其中，所述页面包括H5编辑界面；根据所述元素在页面中的位置判断所述元素位于所述H5编辑界面内；当判断所述元素在所述页面中的位置超出任一预设的可视区域时，显示超出范围的提示信息。
【技术特征摘要】
1.一种H5页面制作兼容显示的方法，其特征在于，包括以下步骤：检测被选中的元素；当监听到移动所述元素的事件时，实时获取所述元素在页面中的位置；其中，所述页面包括H5编辑界面；根据所述元素在页面中的位置判断所述元素位于所述H5编辑界面内；当判断所述元素在所述页面中的位置超出任一预设的可视区域时，显示超出范围的提示信息。2.根据权利要求1所述的H5页面制作兼容显示的方法，其特征在于，所述根据所述元素在页面中的位置判断所述元素位于所述H5编辑界面内，具体为：根据所述元素在页面中的位置、所述元素的长和宽及所述H5编辑界面在所述页面中的相对位置，判断所述元素位于所述H5编辑界面内。3.根据权利要求1所述的H5页面制作兼容显示的方法，其特征在于，所述H5编辑界面以顶部所在的直线为第一基准线，以任一垂直边缘所在的直线为第二基准线；则所述当判断所述元素在所述页面中的位置超出手机信息库中任一款手机的可视区域时，显示超出范围的提示信息具体包括：当根据所述元素在页面中的位置及所述第一基准线判断所述元素超出手机信息库中任一款手机的屏幕可视高度时，显示辅助线以标注该手机的屏幕可视高度；和/或当根据所述元素在页面中的位置及所述第二基准线判断所述元素超出手机信息库中任一款手机的屏幕可视宽度时，显示辅助线以标注该手机的屏幕可视宽度。4.根据权利要求1所述的H5页面制作兼容显示的方法，其特征在于，所述H5编辑界面以顶部所在的直线为第一基准线，以任一垂直边缘所在的直线为第二基准线；则所述当判断所述元素在所述页面中的位置超出手机信息库中任一款手机的可视区域时，显示超出范围的提示信息具体包括：当根据所述元素在页面中的位置、所述元素的长度及所述第一基准线判断所述元素超出手机信息库中任一款手机的屏幕可视高度时，显示辅助线以标注该手机的屏幕可视高度；和/或当根据所述元素在页面中的位置、所述元素的宽度及所述第二基准线判断所述元素超出手机信息库中任一款手机的屏幕可视宽度时，显示辅助线以标注该手机的屏幕可视宽度。5.根据权利要求1至4任意一项所述的H5页面制作兼容显示的方法，其特征在于，所述当监听到移动所述元素的事件时，实时获取所述元素在页面中的位置具体为：当监听到通过操控介质移动所述元素的事件时，实时获取所述操控介质在页面中的位置以及所述操控介质相对于所述元素的位置；根据所述操控介质在所述页面中的位置以及所述操控介质相对于所述元素的位置，获取所述元素在页面中的位置。6.一种H5页面制作兼容显示的装置，其特征在于，包括：检测模块，用于检测被选中的元素；位置获取模块，用于当监听到移动所述元素的事件时，实时获取所述元素在页面中的位置；其中，所述页面包括H5编辑...
【专利技术属性】
技术研发人员：周文，
申请(专利权)人：网易杭州网络有限公司，
类型：发明
国别省市：浙江,33
还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。