移动端适配

最新推荐文章于 2024-09-20 17:00:54 发布
转载 最新推荐文章于 2024-09-20 17:00:54 发布 · 209 阅读 · 0

博客分享了GitHub的一个链接https://github.com/amfe/article/issues/17?utm_source=caibaojian.com，同时还给出了两个参考链接，分别是http://caibaojian.com/flexible-js.html和https://segmentfault.com/a/1190000011586301?utm_source=tag-newest。

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

JTOPO纯前端拓扑图
01-02
完整DEMO。纯前端代码，后台采用模拟数据。稍加修改即可用于自己的项目中。
jTopo 场景移动，节点位置保持不变
weixin_43896125的博客
11-21 418
vue内使用jtopo插件，移动场景sence时node节点位置保持不变
jtopo鹰眼的样式修改，(jtopo加鹰眼后，topo图中有一条连线的颜色被鹰眼边框颜色覆盖)
笑到世界都狼狈的博客
01-14 1160
最近在写topo图的时候，topo图书莫名其妙出现一条黑色连线，但是数据库里并没有设计黑色的连线，经过反复确定发现只要显示鹰眼就会显示黑线，不显示鹰眼就不会显示那条黑线，效果如下图所示： 看代码是时候，在jtopo-0.4.8-min.js大概五百二十行左右有这样的代码，意识差不多就是鹰眼能看到的边框，灰色填充，以及拓扑显示，如果想简单粗暴的只改黑线的问题，把拓扑的边框影藏掉即可，既：代码中...
前端开发框架总结之利用Jtopo实现网络拓扑功能（一）
wiki_Wei的博客
10-27 3779
                      前端开发框架总结之利用Jtopo实现网络拓扑功能（一） 前言：     前段时间由于项目需要实现一个网络设备拓扑管理的功能，经过一番比较，最终选择了利用JTopo插件来实现相关功能。首先JTopo是免费的，其次官网上的一些拓扑示例还算比较全面，能覆盖大部分拓扑场景，再次个人认为JTopo从功能定位和API设计及实现来讲还是很清晰且简洁的，比较容易理解...
前端开发框架总结之利用Jtopo实现网络拓扑功能（五）
wiki_Wei的博客
10-28 2367
                         前端开发框架总结之利用Jtopo实现网络拓扑功能（五） 上文我们讲了拓扑元素序列化与反序列化相关的实现思路以及一些关键技术细节。为了让拓扑管理的功能更丰富化，我们今天再加入一些使用的交互与展示效果，来继续我们的拓扑管理开发之旅 拓扑对象右键菜单 为了使用更多的拓扑操作，我们将功能入口设置在右键拓扑对象弹出的菜单当中。这个官网demo中已...
vue3移动端适配的解决方案（老方案）
12-01
Vue3 移动端适配解决方案是针对现代前端框架 Vue3 的一项技术实践，旨在确保在不同设备和屏幕尺寸上提供良好的用户体验。Vue3 提供了更强大的功能和更高的性能，但移动端适配是一个挑战，因为移动设备的屏幕尺寸、...
手淘解决移动端适配问题（flexible）
09-27
在移动互联网快速发展的今天，移动端适配已经成为网页设计和开发中的关键问题。"手淘解决移动端适配问题（flexible）"的方案是阿里巴巴手淘团队提出的一种高效、灵活的移动端适配策略，旨在帮助开发者解决不同设备...
大前端之移动端适配
最新发布
w807139809的博客
09-20 1061
目前市面上移动端屏幕尺寸非常的繁多，很多时候我们希望一个元素在不同的屏幕上显示不同的大小以此来更好的还原效果图：当我们针对一个手机进行布局设计时，设置了一个 200 * 200 大小的盒子但在不同的设备上，由于逻辑像素不同的问题，会使得这个盒子在更大的视口上显得很小，在更小的视口上显示很大因此我们需要进行适配让它在不同设备上所占据视口的空间比例是相同的。
flexible.js + makegrid.js 自适应布局
weixin_33895695的博客
11-17 573
一，flexible.js 的使用方式： （一），引用方式 1，引用cdn地址 <script src="http://g.tbcdn.cn/mtb/lib-flexible/0.3.2/??flexible_css.js,flexible.js"></script> 当前最新的版本是0.3.2。 2，下载flexible.js 等文件到项目指定目录下，然后在head中...
jtopo网络拓扑图
08-01
在公司的需求下，研究了一下jtopo，做了一个拓扑图，内部封装了设备离线触发方法
前端h5框架总结
weixin_33806300的博客
10-24 190
关于单独h5网站项目，目前主要前端框架有：react、vue、bootstrap等，其中react和vue都是用mvvm模式（低耦合、可重用性、独立开发、可测试），数据实时更新，适合app里面嵌入的网页使用，但用在传统web网页上对seo不太好，因为数据都需要通过js传递，页面html只有简单的结构布局。bootstrap比较符合web网站做seo的，兼容跨屏的同时又能保持数据输出。 性能方面的对...
移动端H5终端适配方案
qq_43248623的博客
07-07 837
1.JS的根据不同屏幕宽度动态设置html的font-size，使用rem布局。 a.手淘方案 flexible+rem（参考https://github.com/amfe/article/issues/17） 引入flexible.js，不需要在html结构中加入viewport标签。 flexible.js会在元素上增加一个data-dpr属性，以及一个font-size样式。JS会根据不同的设备添加不同的data-dpr值，比如说2或者3；同时会给html加上对应的font-size的值，比如说75p
前端开发框架总结之利用Jtopo实现网络拓扑功能（二）
wiki_Wei的博客
10-27 1547
                    前端开发框架总结之利用Jtopo实现网络拓扑功能（二） 上文我们讲了一些拓扑结点生成的实际场景设计和实现思路以及一些关键技术细节。本文我们继续我们的拓扑管理开发之旅。 拓扑连线 给拓扑结点添加连线是拓扑管理中必不可少的操作，官网的例子中也有相应的例子。但是如果我们完全按照这个例子的操作方式用到我们项目中的话，其实是很不可取的，例子中是单击结点进行...
jTopo如何实现不可拖拽
weixin_42650105的博客
02-26 903
jTopo如何实现不可拖拽 我们在node节点进行拖拽的时候进行监听,使用的是mousedrag事件,然后设置所拖动节点的dragable为false this.scene.mousedrag(function(e)){ e.target.dragable = false;//将拖拽设置为false e.target.visible = false;//将节点设置为不可见 } 如果不懂 this.scene 结构的可以参考我的另一篇简单入门的topo文章https://blog.youkuaiyun.com/we
flexible.js ——移动端自适应方案（二）
qq_45516629的博客
03-15 1189
GitHub下载地址：https://github.com/amfe/lib-flexible 官方文档地址：https://github.com/amfe/article/issues/17 1、什么是flexible.js 是一个终端设备适配的解决方案。也就是说它可以让你在不同的终端设备中实现页面适配。 是一个用来适配移动端的javascript框架。根据宽度的不同设置不同的字体大小，...
手机淘宝——flexible.js 移动端自适应方案
热门推荐
assassin_0302的博客
02-28 2万+
一，flexible.js 的使用方式： github地址：https://github.com/amfe/lib-flexible 官方文档地址：https://github.com/amfe/article/issues/17 本文中有部分内容引至上面这个文档。 （一），引用方式 1，引用cdn地址 <script src="http://g.tbcdn.cn/mtb/lib-...
使用Flexible实现手淘H5页面的终端适配 #17
易天海
05-21 621
使用Flexible实现手淘H5页面的终端适配#17 https://github.com/amfe/article/issues/17 使用flexible后 不同设备的data-dpr还始终为1解决方法 https://www.w3h5.com/post/35.html ...
H5移动端适配：Flexible方案详解
"本文主要介绍H5移动端适配的Flexible方案，探讨了移动端适配的基本概念，包括视觉稿、物理像素、设备独立像素和设备像素比，并解释了如何利用这些概念进行高清适配和布局处理。" 在H5移动端开发中，适配问题是一个...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值