我正在创建一个全屏网络应用程序，它将包含一些使用新的 iOS 5 溢出:滚动功能的模块/小部件。 我想要的是在滚动 html/body 时禁用那种“flex ”效果(因为它是全屏)，但只在可滚动元素上保持这种效果。
平滑我拥有的可滚动元素的效果:
html, body { overflow: hidden; }
.scrollable {
overflow: scroll;
-webkit-overflow-scrolling: touch;
}
然后是以下禁用触摸滚动效果的脚本:
$(document).bind('touchmove', function (e) {
if (e.target === document.documentElement) {
e.preventDefault();
}
});
虽然这似乎根本不起作用，因为当将元素滚动到最底部或顶部时，它也会滚动 documentElement。
有没有办法只对 body html 元素禁用该效果？
这是一个很好的例子，说明这如何影响功能:
最佳答案
不幸的是-webkit-overflow-scrolling没有更好地处理这个。您需要跟踪 y使其工作的位置。我把课 scroll在我想在页面上滚动的任何内容上，例如 <ul>元素。包装一个 <div> <ul>周围用 overflow-y: auto 填充视口(viewport).不要放 overflow或 height在 <ul> 上. <ul>将扩展到它的内容一样高，它是 <div>这实际上是在做滚动。 -webkit-overflow-scrolling是继承的，因此请尽可能将其放在 DOM 中。
演示:http://jsfiddle.net/ThinkingStiff/FDqH7/
脚本:
var swipeY = 0;
function onTouchMove( event ) {
var scroll = event.target.closestByClassName( 'scroll' );
if ( scroll ) {
var top = scroll.positionTop - scroll.parentNode.positionTop,
heightDifference = ( 0 - scroll.offsetHeight + scroll.parentNode.offsetHeight );
if( ( top >= 0 ) && ( event.touches[0].screenY > swipeY ) ) {
event.preventDefault(); //at top, swiping down
} else if( ( top <= heightDifference ) && ( event.touches[0].screenY < swipeY ) ) {
event.preventDefault(); //at bottom, swiping up
};
} else {
event.preventDefault();
};
};
function onTouchStart( event ) {
swipeY = event.touches[0].screenY;
};
Element.prototype.closestByClassName = function ( className ) {
return this.className && this.className.split( ' ' ).indexOf( className ) > -1
? this
: ( this.parentNode.closestByClassName && this.parentNode.closestByClassName( className ) );
};
window.Object.defineProperty( Element.prototype, 'positionTop', {
get: function () {
return this.offsetTop - this.parentNode.scrollTop;
}
} );
document.getElementById( 'viewport' ).addEventListener( 'touchmove', onTouchMove, false );
document.getElementById( 'viewport' ).addEventListener( 'touchstart', onTouchStart, false );
HTML:
<div id="viewport">
<div id="scroll-view">
<ul class="scroll">
<li>scroll scroll scroll scroll scroll </li>
<li>scroll scroll scroll scroll scroll </li>
<li>scroll scroll scroll scroll scroll </li>
. . .
</ul>
</div>
</div>
CSS:
#viewport {
border: 1px solid black;
height: 460px;
width: 320px;
-webkit-overflow-scrolling: touch;
}
#scroll-view {
height: 100%;
overflow-y: auto;
width: 100%;
}
关于javascript - 仅针对 html 禁用 flex 滚动，但针对溢出 :scroll 的元素进行维护，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/8052919/
很好奇，就使用rubyonrails自动化单元测试而言，你们正在做什么？您是否创建了一个脚本来在cron中运行rake作业并将结果邮寄给您？git中的预提交Hook？只是手动调用？我完全理解测试，但想知道在错误发生之前捕获错误的最佳实践是什么。让我们理所当然地认为测试本身是完美无缺的，并且可以正常工作。下一步是什么以确保他们在正确的时间将可能有害的结果传达给您？ 最佳答案 不确定您到底想听什么，但是有几个级别的自动代码库控制:在处理某项功能时，您可以使用类似autotest的内容获得关于哪些有效，哪些无效的即时反馈。要确保您的提
在控制台中反复尝试之后，我想到了这种方法，可以按发生日期对类似activerecord的(Mongoid)对象进行分组。我不确定这是完成此任务的最佳方法，但它确实有效。有没有人有更好的建议，或者这是一个很好的方法？#eventsisanarrayofactiverecord-likeobjectsthatincludeatimeattributeevents.map{|event|#converteventsarrayintoanarrayofhasheswiththedayofthemonthandtheevent{:number=>event.time.day,:event=>ev
我想将html转换为纯文本。不过，我不想只删除标签，我想智能地保留尽可能多的格式。为插入换行符标签，检测段落并格式化它们等。输入非常简单，通常是格式良好的html(不是整个文档，只是一堆内容，通常没有anchor或图像)。我可以将几个正则表达式放在一起，让我达到80%，但我认为可能有一些现有的解决方案更智能。 最佳答案 首先，不要尝试为此使用正则表达式。很有可能你会想出一个脆弱/脆弱的解决方案，它会随着HTML的变化而崩溃，或者很难管理和维护。您可以使用Nokogiri快速解析HTML并提取文本:require'nokogiri'h
我正在编写一个包含C扩展的gem。通常当我写一个gem时，我会遵循TDD的过程，我会写一个失败的规范，然后处理代码直到它通过，等等......在“ext/mygem/mygem.c”中我的C扩展和在gemspec的“扩展”中配置的有效extconf.rb，如何运行我的规范并仍然加载我的C扩展？当我更改C代码时，我需要采取哪些步骤来重新编译代码？这可能是个愚蠢的问题，但是从我的gem的开发源代码树中输入“bundleinstall”不会构建任何native扩展。当我手动运行rubyext/mygem/extconf.rb时，我确实得到了一个Makefile(在整个项目的根目录中)，然后当
在我的Controller中，我通过以下方式在我的index方法中支持HTML和JSON:respond_todo|format|format.htmlformat.json{renderjson:@user}end在浏览器中拉起它时，它会自然地以HTML呈现。但是，当我对/user资源进行内容类型为application/json的curl调用时(因为它是索引方法)，我仍然将HTML作为响应。如何获取JSON作为响应？我还需要说明什么？ 最佳答案 您应该将.json附加到请求的url，提供的格式在routes.rb的路径中定义。这
所以我在关注Railscast，我注意到在html.erb文件中，ruby代码有一个微弱的背景高亮效果，以区别于其他代码HTML文档。我知道Ryan使用TextMate。我正在使用SublimeText3。我怎样才能达到同样的效果？谢谢! 最佳答案 为SublimeText安装ERB包。假设您安装了SublimeText包管理器*，只需点击cmd+shift+P即可获得命令菜单，然后键入installpackage并选择PackageControl:InstallPackage获取包管理器菜单。在该菜单中，键入ERB并在看到包时选择
这是一道面试题，我没有答对，但还是很好奇怎么解。你有N个人的大家庭，分别是1,2,3,...,N岁。你想给你的大家庭拍张照片。所有的家庭成员都排成一排。“我是家里的friend，建议家庭成员安排如下:”1岁的家庭成员坐在这一排的最左边。每两个坐在一起的家庭成员的年龄相差不得超过2岁。输入:整数N，1≤N≤55。输出:摄影师可以拍摄的照片数量。示例->输入:4，输出:4符合条件的数组:[1,2,3,4][1,2,4,3][1,3,2,4][1,3,4,2]另一个例子:输入:5输出:6符合条件的数组:[1,2,3,4,5][1,2,3,5,4][1,2,4,3,5][1,2,4,5,3][
我已经构建了一些serverspec代码来在多个主机上运行一组测试。问题是当任何测试失败时，测试会在当前主机停止。即使测试失败，我也希望它继续在所有主机上运行。Rakefile:namespace:specdotask:all=>hosts.map{|h|'spec:'+h.split('.')[0]}hosts.eachdo|host|begindesc"Runserverspecto#{host}"RSpec::Core::RakeTask.new(host)do|t|ENV['TARGET_HOST']=hostt.pattern="spec/cfengine3/*_spec.r
我们的git存储库中目前有一个Gemfile。但是，有一个gem我只在我的环境中本地使用(我的团队不使用它)。为了使用它，我必须将它添加到我们的Gemfile中，但每次我checkout到我们的master/dev主分支时，由于与跟踪的gemfile冲突，我必须删除它。我想要的是类似Gemfile.local的东西，它将继承从Gemfile导入的gems，但也允许在那里导入新的gems以供使用只有我的机器。此文件将在.gitignore中被忽略。这可能吗？ 最佳答案 设置BUNDLE_GEMFILE环境变量:BUNDLE_GEMFI
我正在使用Rails构建一个简单的聊天应用程序。当用户输入url时，我希望将其输出为html链接(即“url”)。我想知道在Ruby中是否有任何库或众所周知的方法可以做到这一点。如果没有，我有一些不错的正则表达式示例代码可以使用... 最佳答案 查看auto_linkRails提供的辅助方法。这会将所有URL和电子邮件地址变成可点击的链接(htmlanchor标记)。这是文档中的代码示例。auto_link("Gotohttp://www.rubyonrails.organdsayhellotodavid@loudthinking.