Tag: webkit

iframe动态高度resize

嗨，我目前有2页（index.html和iframe_contents.html）。 两者都在同一个域上。 我目前正在尝试根据内容大小动态调整iframe大小。 我正在使用它来帮助我http://benalman.com/code/projects/jquery-resize/examples/resize/如果iframe_contents body标记在Firefox和IE 7/8/9上变得更大或更小，它可以工作webkit它只能成长，永远不会缩小 我已将它缩小到iframe_contents.html中的body标签，而不是在内容高度更改时缩小，而是仅在iframe中缩小。 当iframe_contents.html不在iframe中时，如果缩小/放大元素，则主体整体高度会发生变化。 这是一个特定于webkit的问题吗？

submit（）函数有回调吗？

我有这个代码，以及一个提交到框架的文件上传表单： setMyCookie(‘name’,’value_1′); $(‘.myform’).submit(); setMyCookie(‘name’,’value_2′); 问题：Webkit浏览器似乎在表单被提交之前用’value_2’更新’MyCookie’，或者在它被提交的确切时刻更新，因此错误的cookie值随之发送。 我希望在提交表单后立即将cookie值更改为“value_2”，以便cookie可以用于其他请求。 以下代码工作正常，但我不认为使用timeout（）是最好的解决方案。 也许有另一种方法来解决这个问题？ setMyCookie(‘name’,’value_1′); $(‘.myform’).submit(); setTimeout(function(){setMyCookie(‘name’,value_2);},100); 谢谢。

Webkit + jQuery + SuperBGImage：完全浏览器图像没有抗锯齿

此图像最能说明问题： 我正在自定义使用SuperBGImage的WordPress主题。 在Safari 5.1和Chrome 13中，当调整浏览器窗口大小时，图像不会平滑地消除锯齿，并且可以清楚地看到工件。 您可以轻松地将SuperBGImage演示与生产站点进行比较…… SuperBGImage演示与我的项目 我已经将演示图像添加到WordPress网站（个人类别）进行直接比较。 樱桃的形象是最明显的。 我已经在这方面工作了一段时间，并试图以下无济于事： 试图为幻灯片图像添加2px边框，这解决了CSS3变换几乎没有相关的问题。 还原缩放算法，我已修改为永不裁剪图像。 添加了演示中使用的完全相同的图像文件。 试图添加一个box-shadow来触发平滑。 Diff’d所有修改过的JS和CSS试图找到潜在的疏忽。 （ image-rendering: optimizeQuality;和-ms-interpolation-mode: bicubic;保持一致完整。 确认SuperBGImage与jQuery 1.3.2（演示版）和1.6.2（项目）一样正常工作。 构建了一个简化的演示并确认问题不在于我修改过的SuperBGImage JS。 （唯一不同的是裁剪方法。） 在查看SuperBGImage演示时，您会注意到在释放调整后的窗口后大约半秒钟会发生平滑。 我的项目中没有这种微妙的转变，尽管它曾经有效。 有谁知道什么可能导致这种差异？ 与大多数项目不同，我遗憾的是在源代码管理中没有这个，所以我不能仅仅通过修订来解决问题。 对于那些想要摆弄简单演示的人： http ： //jsfiddle.net/4ZcPF/

Blur（）事件未在webkit浏览器中针对选择表单触发

我有一个简单的元素，其中包含多个元素： select dollar amount $5 $10 $15 $20 只有当用户将鼠标hover在页面上的另一个元素上时，才会显示此表单： $(“#parentDiv”).mouseenter(function(){ $(“#selectFormDiv”).show(); //dollarAmount contained in this div }); 在parentDiv上触发mouseleave事件parentDiv ，我确保表单模糊，以便选项不会保持展开状态。 一旦模糊，我可以安全地隐藏包含 以便表单及其容器正确隐藏。 $(“#parentDiv”).mouseleave(function(){ $(“#dollarAmount”).blur(); $(“#selectFormDiv”).hide(); }); 我的问题是：这适用于IE8和Firefox 5.1，但不适用于Chrome 12.0或Safari 5.1。 我已经检测到浏览器是否是webkit并使用不同的命令进行测试，而且看起来blur()似乎不会导致表单崩溃（正确的术语？试图隐藏掉落的选项）。 如果在离开parentDiv展开它们，则上述代码不会隐藏选项。 触发表单上的hide()事件会隐藏Chrome中的选项（在Opera中仍然没有运气），但当然也会导致整个表单隐藏： $(“#parentDiv”).mouseleave(function(){ if($.browser.webkit) { $(“#dollarAmount”).hide(); $(“#selectFormDiv”).hide(); } else { $(“#dollarAmount”).blur(); //blur only triggers for non webkits? $(“#selectFormDiv”).hide(); } }); 我已经尝试了其他一些事件/方法，包括在mouseleave上触发document.mouseup来触发blur() 。 我试图使用focusout ， change和click事件来折叠选择表单，但没有成功。 […]

使用webkit-scrollbar – 滚动到底部问题

我正在使用:: – webkit-scrollbar选择器，它需要body标签上的以下css： body { position:absolute; top:0; left:10px; bottom:0; right:10px; overflow-y:scroll; overflow-x:hidden; } 我需要让页面向下滚动以使用以下jQuery显示一个靠近页面底部的元素： $(‘.tester’).click(function() { $(‘html, body’).animate({ scrollTop: $(document).height() }, ‘slow’); return false; }); 由于body标记上的position：absolute声明，此行为不起作用。 如果我删除它，向下滚动行为按预期工作，但它会混淆webkit-scrollbar样式。 谁能想到一个解决方法？

图像属性是DOM的一部分（jQuery – webkit与其他浏览器不一致）吗？

我使用jQuery在Chrome和Safari上遇到了一个问题，使用一条图像的宽度进行一些计算。 使用我的计算时： $(document).ready(function() { /* some calculations with $(“img”).width() */ }); 在IE6 +和Firefox中一切正常，但它不适用于Chrome和Safari：$（img）.width（）是0，无论图像是否已经缓存。 使用： $(window).load(function() { /* some calculations with $(“img”).width() */ }); 它适用于所有上述浏览器，但问题是它只在所有图像完全加载时才开始。 webkit行为是预期的行为还是有一些webkit / jQuery错误导致图像属性不是DOM的一部分？ 如果它是webkit / jQuery的问题：有没有办法让我的脚本比上面提到的解决方案更早执行？ 顺便说一句，我没有使用图像尺寸的任何内联属性。

未捕获错误：INVALID_STATE_ERR：带有webkitEnterFullScreen的DOMexception11

$(document).ready(function(){ var url = ‘video.mp4’ var video = $(document.createElement(‘video’)) video.attr(“width”, 300); video.attr(“height”, 150); video.attr(“src”, url); video.attr(“controls”, true); video.attr(“id”, “video”); video[0].addEventListener(“play”, function() { }, false); video[0].play(); video[0].webkitEnterFullScreen(); $(‘body’).append(video); }) 未捕获的错误：INVALID_STATE_ERR：DOMexception11 我究竟做错了什么？

Sticky Headers with -webkit-overflow-scrolling CSS

使用修改过的jQuery插件，我们开发了一个粘性标题滚动框，用于在本机应用程序中模仿iOS上的本机function，并使用可在所有计算机上运行的跨浏览器解决方案。 这是FIDDLE： http ： //jsfiddle.net/f3y9s/1/ 一切正常，包括在iOS上。 更进一步，我想使用-webkit-overflow-scrolling：touch来实现iOS的原生平滑。 问题是，这会导致标题在滚动完成后重新定位，而不是在滚动发生时重新定位。 有没有什么办法解决这一问题。 这是FIDDLE： http ： //jsfiddle.net/f3y9s/ jQuery的 $(document).ready(function($){ $.fn.stickySectionHeaders = function(options) { var settings = $.extend({ stickyClass : ‘sticky’, headlineSelector: ‘strong’}, options); return $(this).each(function() { var $this = $(this); $(this).find(‘ul:first’).bind(‘scroll.sticky’, function(e) { $(this).find(‘> li’).each(function() { var $this = $(this), top = $this.position().top, height = $this.outerHeight(), $head = $this.find(settings.headlineSelector), […]

在Chrome上执行多个选择器时，jQuery中的INVALID_NODE_TYPE_ERR

我正在做一个jQuery多选择器查找： element.find(“fieldset, input[type=hidden], input[type=text], :radio”) 在Chrome版本1中，它在jquery的selector.js的第722行上给出了此错误“INVALID_NODE_TYPE_ERR：DOM范围exception2” aRange.selectNode(a); 在上下文中： function(a, b) { var aRange = a.ownerDocument.createRange(), bRange = b.ownerDocument.createRange(); aRange.selectNode(a); aRange.collapse(true); bRange.selectNode(b); bRange.collapse(true); var ret = aRange.compareBoundaryPoints(Range.START_TO_END, bRange); if (ret === 0) { hasDuplicate = true; } return ret; } 在这种情况下， a是HTML隐藏输入字段。 从我可以找到的，它似乎是较旧的webkit版本的问题，因为在Chrome的新测试版中不会出现此错误（可能是因为它从未命中此代码，因为它实现了document.documentElement.compareDocumentPosition参见选择器。 js＃703 ）。 为了解决这个问题，我用四个单选项替换了多选择器，我将它们合并在一起工作正常，但它真的很难看： elements = element.find(‘fieldset’) .add(element.find(‘input[type=hidden]’)); .add(element.find(‘input[type=text]’)); .add(element.find(‘:radio’)); 这真的是解决这个问题的唯一方法，还是我还能做些什么呢？ 更新 在Sizzle讨论论坛上有一个关于这个的post ，一个可能的Sizzle（jQuery选择器）代码的补丁已经发布，这可能会进入jquery核心。 […]

使用jQuery或JavaScript绑定到自定义CSS动画结束事件？

我们针对同一个对象有多个动画。 当每个动画结束时，我们需要采取不同的行动。 现在，我们绑定到webkitAnimationEnd事件，并使用gnarly if / then语句以不同方式处理每个动画。 有没有办法实质上创建自定义webkitAnimationEnd事件，允许我们在特定动画结束时触发特定的事件处理程序？ 例如， animation1结束时的fire handler1和animation2结束时的fire handler2 。 我们正在构建Webkit浏览器，特别是Mobile Safari。 谢谢！