zepto

微信公众号开发框架

泪湿孤枕 提交于 2019-12-10 16:12:40
sui-mobile 是阿里巴巴国际UED前端团队出品的移动端 UI库,SUI Mobile 是一套基于 Framework7 开发的UI库。它非常轻量、精美,只需要引入他们的CDN文件就可以使用,并且能兼容到 iOS 6.0+ 和 Android 4.0+,非常适合开发跨平台Web App。 官网: http://m.sui.taobao.org/ github: https://github.com/sdc-alibaba/SUI-Mobile zepto Zepto是一个轻量级的针对现代高级浏览器的JavaScript库, 它与jquery有着类似的api。 如果你会用jquery,那么你也会用zepto。 移动版的jquery...和jquery用法几乎一样...主要是因为sui-mobile基于这个 vue.js 数据驱动的组件,为现代化的 Web 界面而生 官网: http://cn.vuejs.org/ 来个例子: html: <!-- 这是我们的 View --> <div id="example-1"> Hello {{ name }}! </div> js: // 这是我们的 Model var exampleData = { name: 'Vue.js' } // 创建一个 Vue 实例或 "ViewModel" // 它连接 View 与 Model var

Prevent Swipe events when interacting with elements on a page

佐手、 提交于 2019-12-10 14:57:41
问题 I am building an iPad application which is essentially a series of slides. When I've finished reading a slide I am able to swipe to the next slide *(using Zepto's swipe) which changes the window.location to the next slide. (the swipe event is bound to the window.body as it needs to work on the whole page)... Here is the problem: some slides have interactive elements such as buttons, draggable items etc. The problem is that the swipe event is triggered when using some of these interactive

Is it possible to use JQuery and Zepto library at the same time?

怎甘沉沦 提交于 2019-12-10 11:14:58
问题 <script src="jsv3/jquery-1.7.1.min.js"></script> <script src="jsv3/jquery-ui-1.9.2.custom.min.js"></script> <script src="jsv3/jquery.mobile-events.js"></script> <script src="jsv3/jquery.ui.touch-punch.js"></script> <script src="jsv3/turn.js"></script> <script src="jsv3/jquery.viewport.min.js"></script> <script src="jsv3/jquery.scraggable.js"></script> <script src="jsv3/history.js"></script> <script src='http://vod.hkheadline.com/player/jwplayer/jwplayer.js'></script> <script src="jsv3/libs

Javascript: How to check if element is visible?

青春壹個敷衍的年華 提交于 2019-12-09 07:31:25
i'm using the lightweight zepto.js framework and now I need to test if an element on the page is visible or not … this my case: A button triggers the function show_guides() . function show_guides() { $('#guides').toggle(); if ( $('#guides').is(':visible') ) { // does not work //$.cookie('guides_visible', 'true'); console.log("visible"); } else { console.log("invisible"); //$.cookie('guides_visible', null); } } If the $('#guides') are visible I want to save a cookie and if they are not I want to get rid of it. However zepto.js doesn't support selectors like :visible so I have to find a

window.resize fail when using Modernizr and Zepto

▼魔方 西西 提交于 2019-12-08 13:57:29
问题 I'm having a problem with resizing an element using JavaScript and the Zepto library. When the page loads the element gets the window width and height just fine. I have also tested my window.resize with an alert() and that works fine too. My problems occurs when I try and resize the element as the window changes size. Here is my JavaScript which is loaded through Modernizr: $(document).ready(function() { setTimeout(function(){ window.scrollTo(0, 1); }, 0); var navConfig = { winWidth : $

Javascript: How to check if element is visible?

风流意气都作罢 提交于 2019-12-08 07:08:56
问题 i'm using the lightweight zepto.js framework and now I need to test if an element on the page is visible or not … this my case: A button triggers the function show_guides() . function show_guides() { $('#guides').toggle(); if ( $('#guides').is(':visible') ) { // does not work //$.cookie('guides_visible', 'true'); console.log("visible"); } else { console.log("invisible"); //$.cookie('guides_visible', null); } } If the $('#guides') are visible I want to save a cookie and if they are not I want

zeptozepto tap “点透”解决办法

老子叫甜甜 提交于 2019-12-07 20:29:13
点透: 点透主要是由于两个div重合,例如:一个div调用show(),一个div调用hide();这个时候当点击上面的div的时候就会影响到下面的那个div; 解决办法主要有2种: 1.github上有一个叫做fastclick的库,它也能规避移动设备上click事件的延迟响应, https://github.com/ftlabs/fastclick 将它用script标签引入页面(该库支持AMD,于是你也可以按照AMD规范,用诸如require.js的模块加载器引入),并且在dom ready时初始化在body上,如 : $(function(){ new FastClick(document.body); }) 然后给需要“无延迟点击”的元素绑定click事件(注意不再是绑定zepto的tap事件)即可。 当然,你也可以不在body上初始化它,而在某个dom上初始化,这样,只有这个dom和它的子元素才能享受“无延迟”的点击 进一步,对于zepto,如果你打算继续使用它,那么它的tap相关事件已经没有用了,我们可以自己build一个无“touch”模块的zepto,以便减小zepto文件的大小和提高运行效率。zepto的github页面有定制化模块的方法,见 https://github.com/madrobby/zepto 的building部分。 2 . 根据分析

Zepto 使用中的一些注意点

旧巷老猫 提交于 2019-12-07 20:28:23
前段时间完成了公司一个产品的 HTML5 触屏版,开发中使用了 Zepto 这个著名的 DOM 操作库。 为什么不是 jQuery 呢?因为 jQuery 的目标是兼容所有主流浏览器,这就意味着它的大量代码对移动端的浏览器是无用或者低效的。 而 Zepto 只针对移动端浏览器编写,因此体积更小、效率更高,更重要的是,它的 API 完全仿照 jQuery ,所以学习成本也很低。 但是在开发过程中,我发现 Zepto 还远未成熟,其中包含了一些或大或小的“坑”,与 jQuery 的差距还是很明显的,所以写篇文章记录下,希望对后来者有帮助 注意,本文撰写时 Zepto 版本为 1.0 正式版 从哪里下载 Zepto 这个问题看起来很蠢,从官网下载不就行了嘛!可是你有没有发现下载链接上面有行小字呢? There are more modules; a list of all modules is available in the README. 在这个 README 里面你会惊奇地发现,Zepto 源码中有 14 个模块,而官网提供的标准版里面只有 7 个模块!而且居然不包含对移动端开发非常重要的 touch 模块(提供对触摸事件的支持)! 所以我的建议是,不要从官网下载,而是从 Github 下载了源代码之后自己 Build 一个版本,这样你可以自行挑选适合的模块

Zepto.js doesn't return false?

梦想与她 提交于 2019-12-07 13:49:21
问题 I'm trying to bind an event handler to a click function using zepto.js. Normally in JQuery I can just say return false and the actual click will never go through. Does Zepto not support this? And if so, how to get around this? 回答1: To duplicate the behaviour of returning false in a jQuery event handler you need to call event.preventDefault() and event.stopPropagation(). 来源: https://stackoverflow.com/questions/6207956/zepto-js-doesnt-return-false

using zepto, is it possible to queue animations?

≯℡__Kan透↙ 提交于 2019-12-07 11:41:25
问题 zepto.js has an API to animate elements, which allows to include a "done" callback function. animate source however jquery type queue API doesn't seem to be supported. I was wondering if there's a built-in approach for creating animation sequences with zepto or should i just pinch a queue function from somewhere? also the "done" callback doesn't pass any parameters, so its bit ugly to know which stage of the anim sequence you are at - maybe theres a workaround for that? 回答1: I'm not sure if