Tag: 变换

-webkit-transform旋转 – Chrome中的像素化图像: 使用-webkit-transform: rotate(-5deg); 在一个容器div上，Chrome呈现了边缘非常锯齿状的图像网格。而在FF（ -moz-transform:和IE（ -ms-filter:一切都看起来不错 – 看下面的区别。我能做些什么吗？

通过有效词将一个词转换成另一个词的algorithm: 我遇到了编辑距离问题的这种变化： devise一个将源词转换为目标词的algorithm。例如：从头到尾，在每一步中，你只需要replace一个字符，而这个字就必须是有效的。你会得到一本字典。这显然是编辑距离问题的一个变种，但在编辑距离，我不在乎这个单词是否有效。那么如何添加这个要求来编辑距离。

错误与转换：规模和溢出：隐藏在Chrome中: 使用CSS3属性transform: scale ，我发现有趣的问题。我想为图片做一些缩放效果。但是，当我用父div的overflow: hidden和border-radius ，子div扩展了父div的范围。更新：问题没有解决。如果我添加transition ，仍然是行不通的。我试图解决这个问题，但没有成功。这里是一个演示

CSS：变换：翻译（-50％，-50％）使文本模糊: 我想中心我的div和我使用这种方法，但它使我的文本里面的div模糊： <!– language: lang-css –> #div { top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } 有什么办法可以让我的div居中？

烘焙转换成SVGpath元素命令: tl; dr总结：给我资源或帮助修复下面的代码，以便通过任意matrix转换SVG <path>元素的path命令。细节：我在写一个库来将任意的SVG形状转换成一个<path>元素。当它在层次结构中没有transform="…"元素的时候，我已经工作了，但是现在我想将对象的局部变换烘焙到path数据命令本身中。在处理简单的moveto / lineto命令时，这主要是工作（下面的代码）。但是，我不确定转换贝塞尔句柄或arcTo参数的适当方式。例如，我可以将这个圆angular矩形转换为<path> ： <rect x="10" y="30" rx="10" ry="20" width="80" height="70" /> –> <path d="M20,30 L80,30 A10,20,0,0,1,90,50 L90,80 A10,20,0,0,1,80,100 L20,100 A10,20,0,0,1,10,80 L10,50 A10,20,0,0,1,20,30" /> 在没有任何圆angular的情况下，我得到了一个有效的结果： <rect x="10" y="30" width="80" height="70" transform="translate(-200,0) scale(1.5) rotate(50)" /> –> <path d="M10,30 L90,30 L90,100 L10,100 L10,30" /> 然而，仅仅转换椭圆弧命令的x / […]

jQuery的点击事件不能在iOS中工作: 第二次更新：看起来像我的一个函数（resetFigures）阻止事件处理程序，所以将其移动到绑定函数的结尾进行sorting。更新：我经过一些基本的testing后意识到点击事件正在注册，只是在点击时框没有翻转。我有我的网站在Chrome和Firefox中工作的基本审美function，但它拒绝在iOS上正常运行（在iPhone 4上使用iOS 6.1和使用iOS 4.3.5的iPad上进行testing）。您可以在这里查看网站，当然还有脚本（main.js）： http ：//bos.rggwebdesigns.com/ 我读过iOS没有正确处理jQuery点击事件，但我正在努力找出一个修复。 Stack Overflow上的一些线程提到了live（）方法，但像下面这样实现它（以及向可点击元素添加onclick="" ）似乎并不奏效： $('.card').live('click touchstart', function() { var figure = $(this).children('.back'); var button = figure.find('.button'); var column = $(this).parents().eq(1); $('.column').removeAttr('style'); column.css('z-index', 2000); resetFigures(); if(flipCard(this)){ swoosh.pause(); swoosh.currentTime = 0; swoosh.play(); } }); 我也遇到了这个有趣的解决scheme项目： http : //aanandprasad.com/articles/jquery-tappable/ 。但是，我也没有这样的运气： $('.card').tappable(function() { var figure = $(this).children('.back'); var button […]

css变换，在铬中锯齿状的边缘: 我一直在使用CSS3转换旋转图像和文本框在我的网站边框。问题在于，Chrome浏览器中的边框看起来十分粗糙，就像没有抗锯齿function的（低分辨率）游戏一样。在IE中，Opera和FF看起来好多了，因为使用了AA（这仍然清晰可见但并不那么糟糕）。我无法testingSafari，因为我没有Mac。旋转的照片和文字本身看起来不错，只是看起来锯齿状的边框。我使用的CSS是这样的： .rotate2deg { transform: rotate(2deg); -ms-transform: rotate(2deg); /* IE 9 */ -webkit-transform: rotate(2deg); /* Safari and Chrome */ -o-transform: rotate(2deg); /* Opera */ -moz-transform: rotate(2deg); /* Firefox */ } 有什么办法可以解决这个问题，例如强迫Chrome使用AA？示例如下：