mipengine / mip-extensions Goto Github PK
View Code? Open in Web Editor NEW[Deprecated] MIP 组件包括官方组件和开发者自定义组件,请到 mip2-extensions 查看官方组件
Home Page: https://www.mipengine.org/doc/3-widget/10-widgets.html
License: MIT License
[Deprecated] MIP 组件包括官方组件和开发者自定义组件,请到 mip2-extensions 查看官方组件
Home Page: https://www.mipengine.org/doc/3-widget/10-widgets.html
License: MIT License
如题
在播放视频前,显示poster时,不显示默认的控制条,在poster上方显示一个大的播放按键(样式可自定义)
这个可根据参数选择只是首次显示或者每次暂停都显示
参见新浪新闻,搜狐新闻
请问这个是你们可以给组件升级呢 还是我们自己封装
<mip-ad
type="ad-ssp"
data-site-id="1402397"
data-block-id="3351338">
</mip-ad>
使用开发者工具查看请求发现502错误.
可以和#25 一起修复
如题
1.支持当前显示的图片和总图片的数量,例如右下角显示1/20(在轮播图很多的情况下有这种需求)。
2.支持滑动时的效果。 目前的是在滑动后显示下一张图片,没有拖动效果(参考swiper)。
组件于2016年11月10日 commit 并被 merge 到master 分支中。 根据docs 中MIP 扩展组件规范 的上线地址格式 https://mipcache.bdstatic.com/static/mip-360doc-script/latest/mip-360doc-script.js 无法访问。
请问一下,不是说三点上线的么?为啥这个 https://mipcache.bdstatic.com/static/v1.1/mip-stats-ajk.js
返回还是404诺?
showbrand为0或1是都显示,同时能不能增加参数,可以控制.navbar-brand 的链接内容,如:' + brandtext + '
这个是模板组件吧?
升级组件,提供手势滑动切换。
实现 history.go(-1)
mip-experiment是一个用于页面实验的组件。站长通过配置实验变量,达到展示不同页面内容样式的目的。支持通过url配置,强制显示某个实验效果。
mip-x-name="groupA"
属性。站长通过css选择器来控制前端样式。从Cookie中读取实验分组。已存在分组的用户,直接标记分组。未存在分组的用户,使用math.random进行分组。
使用mip-cookie组件,在cookie中储存用户的实验分组,支持多组实验同时进行。
强制抽样,支持配置多组实验
使用百度统计的自定义变量api,将实验名和实验分组作为参数加入到统计请求中。具体需要和百度统计对一下技术方案。
站长在使用mip-pix组件时加入mip-x-A={mip-x-A-group}参数,在组件中会将mip-x-A-group替换成mip-x-A的分组,拼出最终请求。
// mip-pix 用法
<mip-pix src="https://yourselfdomain/mipurl/tj.gif?
t={TIME}&title={TITLE}&host={HOST}
&mip-x-A={MIP-X-A}&mip-x-B={MIP-X-B}
&from=baidu">
</mip-pix>
// 产生的mip-pix请求
https://yourselfdomain/mipurl/tj.gif?
TIME=1483961727115&
title=%E…%97%E6%AC%A2%E8%BF%8E&
host=http%3A%2F%2F172.20.130.52%3A8014%2Ffixed1.html&
from=baidu&
mip-x-A=groupRed&
mip-x-B=groupYellow
现有广告计费方式为:页面加载后算一次广告展示。页面广告在隐藏元素中或用户未看到广告也算一次展示。
在实验中,如果广告外层元素为display:none,则应该不计费。
例如,站长需要针对广告位A进行抽样,40%显示广告M,40%显示广告N,20%不显示广告。
<mip-experiment>
<script type="application/json">
{
"ad-A-exp": {
"variants": {
"showM": 40,
"showN": 40
}
}
}
</script>
</mip-experiment>
/* 40%流量显示广告M */
body[amp-x-ad-A-exp="showM"] .wrapper-A .M {
display: block;
}
body[amp-x-ad-A-exp="showM"] .wrapper-A .N {
display: none;
}
/* 40%流量显示广告N */
body[amp-x-ad-A-exp="showN"] .wrapper-A .M {
display: none;
}
body[amp-x-ad-A-exp="showN"] .wrapper-A .N {
display: block;
}
/* 20%流量不显示广告 */
body .wrapper-A .M,
body .wrapper-A .N {
display: none;
}
mip-experiment=bWlwLWV4cC1BPWdyb3VwQSZtaXAtZXhwLUI9
统计事件同时使用 click 和 load 的时候 去触发click的时候并没有生效 并且触发到了load。
现在我们遇到这个问题希望能够快点解决。http://m.iask.sina.com.cn/mib/tqmMWGJOfF.html
2016年11月11日 上午提交的版本,已经 commit 并且 merge ,但是线上文件https://mipcache.bdstatic.com/static/v1.2/mip-360doc-script.js 还是旧版本
在mip内置模块中增加是否是微信内置浏览器和是否是ipad的判断 @wupengFEX
<mip-ad
type="ad-ssp"
data-site-id="1402397"
data-block-id="3351338">
</mip-ad>
使用开发者工具查看请求发现502错误.
根据MDN文档,input没有type="input"的选项:https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/Input
引用了mip-ad-baidu组件之后,浏览器出现错误提示
Uncaught TypeError:
Failed to execute 'getPropertyValue' on 'CSSStyleDeclaration':
1 argument required, but only 0 present.
经过检查,是
https://mipcache.bdstatic.com/static/v1.2/ads/mip-ad-baidu.js
里的如下代码引起的。
e&&e.getPropertyValue()?e.getPropertyValue("position"):"";
组件说明表格
说明文字内容
// 代码示例
描述:
是否必须:
取值:
组件说明表格
说明文字内容
// 代码示例
描述:
是否必须:
取值:
增加一个点击展开更多的组件
mip-lightbox a标签的颜色请不要!important 啊
求放过
现在的mip页面都是在cdn下面,站长设置存储(如cookie)是不被建议的,因为会造成存储乱用,臃肿,安全性等问题,为此需要开发一套存储系统来统一管理。
mip-form和mip-lightbox组件有个bug
你们可以尝试同一个页面引入这两个组件,当使用form表单提交后,然后把页面刷新,这时候lightbox弹层就会失效,不知道什么原因
我测试的浏览器是360手机模式,谷歌移动端模式。两个浏览器都是这样的问题。
但是我用iPhone7的自带浏览器safari没发现问题。求官方解决
---- [email protected]
mip 的a标签加target="_blank",该属性时 在打开 链接都生成 一个 新的窗口, 如果在同一个站访问多个页面时没有注意适当关掉一些窗口,会出现一大堆。手机配置比较低的会很卡。
内置的mip-carousel 多图轮播 建议加入小圆点指示器,比较常用到。
华为mate7自带浏览器可以复现问题。滚动时mip-fixed正常,内嵌fixed元素抖动。
在开发自有业务组件过程中,有时会有大量的DOM,希望能支持require html文件,把DOM结构模块化。
mip-live-list是一个用于页面非感知实时刷新的组件。主要是加强用户的沉浸式阅读体验。用户无需手动触发更新以判断页面是否存在新内容。该组件会自动判断页面是否有内容更新,通过提示以告知用户更新。
业界一些新闻类页面,比如微博,今日头条,手百下的新闻列表等,在用户访问页面的时候,不需要用户刷新页面,页面会定时的去访问数据接口请求最新数据,如果有最新数据,则提示用户内容有更新。
请求控制: 采用定时器实现定时调用fetchDocument对文档进行请求
fetchDocument: 异步请求本页面(url = 当前url + origin)
文档解析loadXML解析文档
diff当前页面中的id以判断返回页面是否存在id更新
对返回的数据进行时间排序以及条数控制按钮
显示提醒按钮
插入到页面中
请求的url由会自带一个origin数据,origin数据为mip页面自身的url.看起来就是这样: get('http://www.mipcache.com?origin=http://www.youraddress.com') .在cache页面中需要cache服务器对源地址进行代理访问以返回最新的页面
将在本地维护一个数组或多个数组(根据mip-live-list来个数确定)。每次页面的返回会获取数据框内存在的id.然后判断id是否再存在于现有的数组中。以判断页面是否需要更新
本地还将维护一份虚拟的dom树,每次更新的数据都会放到虚拟dom树中,等待用户点击更新以便插入到文档中。
支持通过点击调起原生app,如果手机上已经安装了此app,则直接调起;如果手机上没有安装此app,则跳转下载页面去下载;同时,组件有关闭按钮,如果用户点击了关闭按钮,那么用户再次打开页面也不会显示此组件(根据localStorage 控制)
最通用的方法是以 URL Scheme 的方式去打开app,实际实现过程中要区分 IOS 和 安卓两种情况。
安卓:首先,被调起的app需要对配置文件进行注册(https://developer.android.com/training/app-indexing/deep-linking.html );然后,在 head 部分添加 link 标签 <link rel="manifest" href="https://link/to/manifest.json">
;在安卓手机下,当用户点击调起app的按钮或者连接时,会首先异步请求 manifest.json 文件,解析里面的app-id,然后进行调起
IOS:首先,在 head 部分添加 meta 标签 <meta name='apple-itunes-app' content='你的APP-ID'>
;然后,可以通过 URL Scheme来进行调起
如果手机上没有需要调起的app,则应该跳转到下载页去下载
采用业界的基本思路,同时兼容国内市场的情况,具体开发思路如下:
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.