小编rid*_*dle的帖子

我正在使用<input type="text"/>带有数值的基本HTML 文本字段.

我正在添加JavaScript事件keyup以查看用户何时按下向上箭头键(e.which == 38) - 然后我增加数值.

代码运行良好,但有一件事让我感到困扰.当我按下向上箭头键时,Safari/Mac和Firefox/Mac都会在最开始移动光标.<input type="text"/>据我所知,这是每个文本字段的默认行为,这是有道理的.

但这不会产生光标前后跳跃的美学效果(在值改变之后).

开始时的跳跃发生了,keydown但即使有了这些知识,我也无法防止它发生.我尝试了以下方法:

input.addEventListener('keydown', function(e) {
    e.preventDefault();
}, false);

把e.preventDefault()在keyup事件也没有帮助.

有没有办法防止光标移动？

我正在制作一组使用动态渐变的按钮.我通过使用他们专有的CSS扩展来处理Firefox 3.6+和WebKit,我需要做的就是使用background-image:url("gradient.svg")来支持Opera,iOS和IE9.

这是相对容易的,我制作了一个SVG文件,链接它并让它工作.但是,我正在制作一套,所以我需要至少6个渐变.当我通常在图像中执行它时,我创建了一个用于快速HTTP访问的sprite.我不确定如何在SVG中实现这一点 - 我可以使用一个文件并使用#identifiers访问其XML的不同部分,就像XBL一样吗？

我目前的SVG:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" 
         "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg">
    <defs>
        <linearGradient id="select-gradient" x1="0" x2="0" y1="0" y2="1">
            <stop offset="0%" stop-color="rgb(231,244,248)"/>
            <stop offset="100%" stop-color="rgb(207,233,241)"/>
        </linearGradient>
        <style type="text/css">
          rect {
          fill: url(#select-gradient);
          }
      </style>
    </defs>
    <rect x="0" y="0" rx="6" ry="6" height="100%" width="100%"/>
</svg> 

然后我有CSS:

.button-1 {
  background-image: url("gradient-1.svg");
}

.button-2 {
  background-image: url("gradient-2.svg");
}

我想做这样的事情:

.button-1 {
  background-image: url("gradient.svg#gradient1");
}

.button-2 {
  background-image: url("gradient.svg#gradient2");
}

它甚至可能吗？你能帮我吗？我真的不想推送6个XML文件,当我可以用一个.

我正在使用jQuery在页面上设置DOM元素的动画,并且在使用其原生时遇到了障碍animate().

我正试图将我的元素向右移动并改变其不透明度.

$element.animate({
    'left': '50%',
    'opacity': '1.0'
}, 1000);

它工作得很好,但我需要动画的位置在1000MS和不透明度在300毫秒.

我发现我不能这样写:

$element.animate({
    'left': '50%'
}, 1000);


$element.animate({
    'opacity': '1.0'
}, 300);

这将导致排队动画,因为它是相同的元素,jQuery显然需要等待第一个动画完成.或者我在这里做错了什么.

我尝试使用第二个参数表示法(基于http://api.jquery.com/animate)并使用queue: false但它不起作用.我必须说我不完全理解,所以任何更正都是受欢迎的.

所以我的问题是 - 如何独立更改这些CSS属性的持续时间间隔？