【记录】Vue把咨询控件插入到别人网站中

九霄 -
【记录】Vue把咨询控件插入到别人网站中
图片描述

image.png
image.png

思路

1、在网站加载完成后 onload 事件创建一个 div;
2、点击这个创建的 div 后生成 iframe

问题

创建的 iframe 限制了宽/高,所以咨询控件会特别的小。

解决

1、采用了插件实现了页面自适应,根部的 html 标签会有一个根据窗口自由变换的 font-size 自适应值。
2、当进去这个组件的时候在 onMounted 获取 html 给设置 font-size:'192px' 即可同比放大。

注意点
1、咨询控件组件,不能有其它不相关的东西;
2、位置要在屏幕右下角 0/0 位置,这样设置的时候同比放大才能刚好对上;
3、因为是要被别的网站拉去的,所以进去这个页面是不能有任何权限。

对应图示

image.png
image.png
image.png

特别申明:本文内容来源网络,版权归原作者所有,如有侵权请立即与我们联系(cy198701067573@163.com),我们将及时处理。

Tags 标签

前端vue.jsjavascripthtml5es6

扩展阅读

加个好友,技术交流

1628738909466805.jpg