sdc-alibaba / sui-mobile Goto Github PK
View Code? Open in Web Editor NEWSUI Mobile (MSUI)是由阿里巴巴国际UED前端出品的移动端UI库,轻量精美
Home Page: http://m.sui.taobao.org/components/
License: MIT License
SUI Mobile (MSUI)是由阿里巴巴国际UED前端出品的移动端UI库,轻量精美
Home Page: http://m.sui.taobao.org/components/
License: MIT License
页面从A->B->C,请问在C页面怎么back到A页面,F7可以通过
homeView.router.back({
url: 'index.html',
force: true
});
返回
sui Mobile有左滑删除功能么?
初始化时,如果input存在值时,打开浮层时,无法像select一样选中初始值。
你好,一个页面的标签页切换,各标签里面的无限滚动实现应该怎么搞定呢?
github版本下载了,没找到引用文件,github上面的是不是未编译版本?
日期时间控件问题。
第一次无法确认,text框没有值.
第二次变成1950年01月01
使用此ui作为web.
在微信中打开,按照官网加载所有css与js。
没有日期选择框。
设备:android
1、通过路由放问到一个新页面,第一次Picker不起作用,需要刷新下才能点击触发
2、如果Picker只有一列时,在IOS上点开Picker之后,触摸空白处时,存在兼容性问题,会整屏幕往上移动了
在 http://m.sui.taobao.org/extends/#city-picker 中,
使用省市区选择器,你需要在 sm.js 和 sm.css 之后额外引入如下JS文件:
<link rel="stylesheet" href="//g.alicdn.com/sui-mobile/sm/0.5.0/css/sm-city-picker.min.css">
js文件应该为
<script type="text/javascript" src="//g.alicdn.com/sui-mobile/sm/0.5.0/js/sm-city-picker.min.js" charset="utf-8"></script>
完全从官网copy的例子,但是 $(document).on('infinite', '.infinite-scroll', function () {})并不触发事件
pageInit的时候,怎么获取url参数了?
微信里,省市区选择,会调出系统软键盘 手机:魅族mx5 android:5.0.1 微信:6.2.4
使用sui的时候,点击一个链接进入下个页面的时候,在第一个页面上载入了自己的css文件,下个页面消失
您好:
我使用sui加载新页面的时候,get请求的头部竟然是application/json,而不是text/html,我在路由的getPage函数里$.ajax直接设置contentType也是无效,有什么办法可以解决这个问题么?
这边我测试地址:http://mall.jcq.tbapps.cn/mall/user/test
谢谢!
如果一个页面含有popup html组件,则每次router到该页面都会使html源码中的popup代码增加一份副本。另外这些popup组件上的事件也会随之多绑定一次。
微信webview里,页面切换时,有拖影现象 手机:魅族mx5 android:5.0.1 微信版本:6.2.4
这个官方路由demo在iphone4s的ios8 safari浏览器里不起作用啊!
地址:
http://m.sui.taobao.org/docs-demos/router/
求测试解答啊!
app首页的dom树很大,这就会造成页面切换很卡,
原因应该是新的页面插入到dom里面,造成了回流,由于dom树大,回流的过程中要重现计算和渲染,所以造成切换动画卡顿,请问有什么优化方案吗??
目前试用t7过程中十分不好用 打算用vue替代 建议把t7抽离 选用更好的模板引擎
在第一个页面显示输入框,提交跳转后,输入框没有隐藏,
更新0.5.0后 iphone6plus 切换感觉很卡顿 iphone6 上没问题,
安卓5.0以上版本点击A标签链接没有反应,无效。为什么呢?
card-footer,card-header 的display:flex;不兼容安卓机器!item-after在安卓机上,也有问题!
Uncaught TypeError: Cannot read property 'length' of undefined
popup能够正常弹出,默认模式和带问题模式点击时报上面的错误,是按照sui模板套的demo
完整代码奉上
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>我的生活</title>
<meta name="viewport" content="initial-scale=1, maximum-scale=1">
<link rel="shortcut icon" href="/favicon.ico">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<link rel="stylesheet" href="//g.alicdn.com/sui-mobile/sm/0.5.0/css/sm.css">
<link rel="stylesheet" href="//g.alicdn.com/sui-mobile/sm/0.5.0/css/sm-extend.css">
<!--<link rel="stylesheet" href="/your-css-file.css">-->
</head>
<body>
<header class="bar bar-nav">
<h1 class="title">图片浏览器</h1>
</header>
<div class="content page">
<div class="content-block row">
<div class="col-50"><a href="#" class="button pb-standalone">Standalone</a></div>
<div class="col-50"><a href="#" class="button pb-popup">Popup</a></div>
</div>
<div class="content-block"><a href="#" class="button pb-standalone-captions">With Captions</a></div>
<div class="content-block"><a href="#" class="button pb-standalone-video">With Video</a></div>
</div>
<!-- 你的html代码 -->
<script type='text/javascript' src='//g.alicdn.com/sj/lib/zepto/zepto.js' charset='utf-8'></script>
<script type='text/javascript' src='//g.alicdn.com/sui-mobile/sm/0.5.0/js/sm.js' charset='utf-8'></script>
<script type='text/javascript' src='//g.alicdn.com/sui-mobile/sm/0.5.0/js/sm-extend.js' charset='utf-8'></script>
<!--<script src="/your-js-file.js"></script>-->
<script type="text/javascript">
/*=== 默认为 standalone ===*/
$(function() {
/*=== 默认为 standalone ===*/
$.photoBrowser.prototype.defaults.container = '#iwindow';
var myPhotoBrowserStandalone = $.photoBrowser({
photos: [
'//img.alicdn.com/tps/i3/TB1kt4wHVXXXXb_XVXX0HY8HXXX-1024-1024.jpeg',
'//img.alicdn.com/tps/i1/TB1SKhUHVXXXXb7XXXX0HY8HXXX-1024-1024.jpeg',
'//img.alicdn.com/tps/i4/TB1AdxNHVXXXXasXpXX0HY8HXXX-1024-1024.jpeg',
]
});
//点击时打开图片浏览器
$(document).on('click', '.pb-standalone', function() {
myPhotoBrowserStandalone.open();
});
/*=== Popup ===*/
var myPhotoBrowserPopup = $.photoBrowser({
photos: [
'//img.alicdn.com/tps/i3/TB1kt4wHVXXXXb_XVXX0HY8HXXX-1024-1024.jpeg',
'//img.alicdn.com/tps/i1/TB1SKhUHVXXXXb7XXXX0HY8HXXX-1024-1024.jpeg',
'//img.alicdn.com/tps/i4/TB1AdxNHVXXXXasXpXX0HY8HXXX-1024-1024.jpeg',
],
type: 'popup'
});
$(document).on('click', '.pb-popup', function() {
myPhotoBrowserPopup.open();
});
/*=== 有标题 ===*/
var myPhotoBrowserCaptions = $.photoBrowser({
photos: [{
url: '//img.alicdn.com/tps/i3/TB1kt4wHVXXXXb_XVXX0HY8HXXX-1024-1024.jpeg',
caption: 'Caption 1 Text'
}, {
url: '//img.alicdn.com/tps/i1/TB1SKhUHVXXXXb7XXXX0HY8HXXX-1024-1024.jpeg',
caption: 'Second Caption Text'
},
// 这个没有标题
{
url: '//img.alicdn.com/tps/i4/TB1AdxNHVXXXXasXpXX0HY8HXXX-1024-1024.jpeg',
},
],
theme: 'dark',
type: 'standalone'
});
$(document).on('click', '.pb-standalone-captions', function() {
myPhotoBrowserCaptions.open();
});
/*=== 有视频 ===*/
var myPhotoBrowserVideo = $.photoBrowser({
photos: [{
html: '<iframe src="//www.youtube.com/embed/lmc21V-zBq0?list=PLpj0FBQgLGEr3mtZ5BTwtmSwF1dkPrPRM" frameborder="0" allowfullscreen></iframe>',
caption: 'Woodkid - Run Boy Run (Official HD Video)'
}, {
url: 'http://lorempixel.com/1024/1024/sports/2/',
caption: 'Second Caption Text'
}, {
url: 'http://lorempixel.com/1024/1024/sports/3/',
}, ],
theme: 'dark',
type: 'standalone'
});
$(document).on('click', '.pb-standalone-video', function() {
myPhotoBrowserVideo.open();
});
})
</script>
</body>
</html>
版本为0.5.0
picker调出后,触摸滑动picker的非文字部分,picker后面的内容响应了拖动,进行了滑动响应
测试环境:ios 8.4 iPhone5
“注意: 使用 push.js 加载新页面”,使用帮助里是这么写的,但是push.js具体指的是哪个插件啊?
关于底部工具栏的切换问题困扰我一天了。。。
Our team want to write web page just like native effect.And i think this source is closer to what we want.
when apply the router features, form a page to another page ,the sliding effect is great.
But when i scan a page of news-list, and i find one list to go in.I want when i go back to the news-list, the page is still the position when i go in.Because i dont want to see more news form the beginning position everytime
微信里,无限加载,滚动条乱跳 手机:魅族mx5 android:5.0.1 微信:6.2.4
Uncaught TypeError: Cannot read property 'style' of null
我在chrome里面 模拟手机的时候 layer是undefined
测试发现在UC浏览器下,写一个最简单的页面,引入的是0.5.0的css与js,但是引入min的css 列表的样式不对, 向右箭头在左边,但是引入完整版的css 就不会有问题。其次是列表的 标签连接失效,点击完全没反应
比如把网页滚动到底部想把网页网下拉回到顶部,是滚动条操作,结果却触发了下拉刷新事件
做电商业务的时候购物车的 numberbox 插件 还是比较常见的。
cdn上的v0.5.0在手机Safari浏览器中空白页面,0.4及以下版本是正常的
http://183.56.152.213:45/index04.html //v0.4正常
http://183.56.152.213:45/index05.html //v0.5手机Safari浏览器异常
。。。。
RT,点击两次才能完成回退操作
iphone4s ios8.4.1
有如下场景:
html是由模板引擎生成的,将此html内容(包含
使用$.attachInfiniteScroll('.content')处理报错(Uncaught TypeError: Cannot read property 'on' of undefined)
先调用 $.refreshScroller()然后调用上述函数也会出现这个问题。
是因为content没有经过页面初始化的处理导致的吗?
如果是,msui有提供相关api进行处理这个问题吗?
是否有相关js api来手动初始化各个组件?
点击连接报这个错,怎么回事。
幻灯片滑动的时候俩种图片中间弄个留白,一点不美观,怎么去掉 margin-right: 10px;
这个是什么鬼?
<div class="swiper-slide swiper-slide-prev" style="width: 321px; margin-right: 10px;">
<img src="//gqianniu.alicdn.com/bao/uploaded/i4//tfscom/i1/TB1n3rZHFXXXXX9XFXXXXXXXXXX_!!0-item_pic.jpg_320x320q60.jpg" alt="">
</div>
问题补充,手机上没有发现这个问题
通过内部路由器对象跳转页面后页面的title标题没有发生变化
在任何元素上增加 .open-panel 类都可以使它能点击打开侧栏。如果有多个侧栏,你可以通过 data-panel='{panel的选择}'来指定具体打开哪一个侧栏。我写了两个侧栏,两个分别用不同的data-panel='{panel的选择}来控制,但是不起作用,加了这个和不加的一样,一直都是显示同一个侧栏。
联系人列表的字母不能停靠在顶部,手机:魅族mx5,android:5.5.1
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.