小编yck*_*art的帖子

如何设置dt和dd的样式以便它们在同一条线上?

使用CSS,我如何设置以下样式:

<dl>
    <dt>Mercury</dt>
    <dd>Mercury (0.4 AU from the Sun) is the closest planet to the Sun and the smallest planet.</dd>
    <dt>Venus</dt>
    <dd>Venus (0.7 AU) is close in size to Earth, (0.815 Earth masses) and like Earth, has a thick silicate mantle around an iron core.</dd>
    <dt>Earth</dt>
    <dd>Earth (1 AU) is the largest and densest of the inner planets, the only one known to have current geological activity.</dd>
</dl>
Run Code Online (Sandbox Code Playgroud)

所以dt一列中的节目内容和dd另一列中的内容,每个dt和相应dd的行在同一行?即生成看起来像这样的东西:

表格式

html css

197
推荐指数
10
解决办法
18万
查看次数

是否有可能在伪元素之前/之后设置iframe样式?

正如标题所说,有没有办法设置iframes伪before/ after?没有用另一个包装iframe div,或者?`

我试着像任何其他元素一样设计样式,但没有成功:

iframe::before {
    content: 'foo';
    position: absolute;
    top: 0;
    left: 0;
}

iframe::after {
    content: 'bar';
    position: absolute;
    top: 0;
    right: 0;
}
Run Code Online (Sandbox Code Playgroud)

http://fiddle.jshell.net/ppRqm/

更新

一个已知的解决方法是将前/后添加到源文件中的元素:http: //fiddle.jshell.net/ppRqm/2/

但有时您无法访问源文件.

css iframe styling pseudo-element css-content

17
推荐指数
1
解决办法
9897
查看次数

在动画制作过程中更改jQuery的动画持续时间

是否可以duration在两个不同的值之间更改当前运行的jQuery动画?

我试图改变duration通过直接分配,但没有成功:

var timing = { duration: 4000 };
$(document).click(function (e) {
  timing.duration = 1000;
});

$('#foo').animate({top:200, left:200}, timing);
Run Code Online (Sandbox Code Playgroud)

...甚至,更改fx.options.durationin step-method不会影响正在运行的动画:

var state = false,
$(document).click(function (e) {
  state = true;
});

$('#foo').animate({top:200, left:200}, {
  duration: 4000,
  step: function(now, fx){
    if(state) fx.options.duration = 1000;
    console.log(fx.options.duration); // 1000
  }
});
Run Code Online (Sandbox Code Playgroud)

这是一个小提琴.有什么想法可以做到这一点?

jquery animation state duration jquery-animate

7
推荐指数
1
解决办法
4955
查看次数

如何扩展jQuery的animate-step函数

有关如何step在jQuery 1.6+中扩展-function的任何想法?

我做了一个特殊事件来触发custom-event每个动画步骤.但是,由于jQuery的动画方法已经改变,或者说step函数不再可扩展($.fx.step导致为空object),因此无法用自己的东西扩展它.

(function($){
    var oldStep = $.fx.step._default;
    $.event.special.animating = { };
    $.fx.step._default = function( fx ) {
        $(fx.elem).trigger('animating', fx);
        oldStep.apply( this, arguments );
    };
}(jQuery));

$('#foo').animate({width: 200});
$('#foo').bind('animating', function(e, fx){
    console.log(fx);
});
Run Code Online (Sandbox Code Playgroud)

任何想法如何使用更新的jQuery版本?

jquery jquery-callback custom-events jquery-animate

6
推荐指数
1
解决办法
650
查看次数

将字节数组转换为没有画布的图像数据

是否可以在不使用画布的情况下将字节数组转换为图像数据?

我目前使用的是这样的东西,但是我认为没有画布可以做到,或者我错了吗?

var canvas = document.getElementsByTagName("canvas")[0];
var ctx = canvas.getContext("2d");

var byteArray = [ 
    255, 0, 0, 255, 255, 0, 0, 255, 255, 0, 0, 255, // red
    0, 255, 0, 255, 0, 255, 0, 255, 0, 255, 0, 255, // green
    0, 0, 255, 255, 0, 0, 255, 255, 0, 0, 255, 255 // blue
];

var imageData = ctx.getImageData(0, 0, 10, 3);
for(var i = 0; i < byteArray.length; i+=4){
    imageData.data[i] = byteArray[i];
    imageData.data[i+1] = byteArray[i + 1]; …
Run Code Online (Sandbox Code Playgroud)

javascript base64 canvas bytearray getimagedata

6
推荐指数
1
解决办法
5143
查看次数

根据十六进制颜色获取最接近的颜色名称

我尝试根据给定的十六进制值获得最匹配的颜色名称.例如,如果我们有六角颜色,#f00我们就得到颜色名称red.

'#ff0000' => 'red'
'#000000' => 'black'
'#ffff00' => 'yellow'
Run Code Online (Sandbox Code Playgroud)

我目前使用levenshtein距离算法来获得最接近的颜色名称,到目前为止效果很好,但有时并不像预期的那样.

例如:

'#0769ad' => 'chocolate'
'#00aaee' => 'mediumspringgreen'
Run Code Online (Sandbox Code Playgroud)

那么任何想法如何让结果更接近?

这是我为获得最接近的颜色而做的:

Array.closest = (function () {

    // http://en.wikibooks.org/wiki/Algorithm_Implementation/Strings/Levenshtein_distance#JavaScript
    function levDist(s, t) {
        if (!s.length) return t.length;
        if (!t.length) return s.length;

        return Math.min(
            levDist(s.substring(1), t) + 1,
            levDist(t.substring(1), s) + 1,
            levDist(s.substring(1), t.substring(1)) + (s[0] !== t[0] ? 1 : 0)
        );
    }

    return function (arr, str) {
        // http://stackoverflow.com/q/11919065/1250044#comment16113902_11919065
        return arr.sort(function (a, b) {
            return levDist(a, str) …
Run Code Online (Sandbox Code Playgroud)

javascript performance colors levenshtein-distance

6
推荐指数
1
解决办法
2648
查看次数

获取有关插入位置的最新信息

如何通过当前的插入位置在textarrea中找到一个单词?

我尝试了类似这样的东西,但这只返回第一个字母到达插入位置的字符.例如:

如果光标位于foo之间,则返回fo而不是foo被检查.

Fo |o bar不等于bar foo.=> Fo期待Foo

Foo bar不等于|bar foo.=> equ期待 equal.

这是我到目前为止所做的:

function getCaretPosition(ctrl) {
    var start, end;
    if (ctrl.setSelectionRange) {
        start = ctrl.selectionStart;
        end = ctrl.selectionEnd;
    } else if (document.selection && document.selection.createRange) {
        var range = document.selection.createRange();
        start = 0 - range.duplicate().moveStart('character', -100000);
        end = start + range.text.length;
    }
    return {
        start: start,
        end: end
    }
}

$("textarea").keyup(function () {
    var caret …
Run Code Online (Sandbox Code Playgroud)

string jquery textarea cpu-word getcaretpos

5
推荐指数
1
解决办法
3374
查看次数

如果向下滚动则向上滑动标题,反之亦然

更新

我在GitHub上做了一个回购:

https://github.com/yckart/Veil.js

非常感谢Sargo DaryaEdward J Payton.


我要创建一个标题,如果向下滚动则向上滑动,反之亦然.问题是,它跳跃(如果你在 - 范围diff之间0-128).

我无法弄清问题所在.知道如何让它正常工作吗?

这是我到目前为止所做的:http://jsfiddle.net/yckart/rKW3f/

// something simple to get the current scroll direction
// false === down | true === up
var scrollDir = (function (oldOffset, lastOffset, oldDir) {
    return function (offset) {
        var dir = offset < oldOffset;
        if (dir !== oldDir) lastOffset = offset;
        oldOffset = offset;
        oldDir = dir;
        return {dir: dir, last: lastOffset};
    };
}());

var header …
Run Code Online (Sandbox Code Playgroud)

javascript jquery scroll header slide

5
推荐指数
1
解决办法
4559
查看次数

jQuery empty()和remove()函数是否异步执行?

do jQuery.fn.empty()remove()函数是否异步执行?我在jQuery文档中找不到这个问题的答案.

ajax jquery asynchronous

4
推荐指数
1
解决办法
1704
查看次数

按空格分割字符串,但不在括号内

我有一个像这样的字符串foo bar(5) baz(0, 3),需要根据每个部分之间的空格将其分成几个部分。所以结果需要如下所示:['foo', 'bar(5)', 'baz(0, 3)']

我尝试过这样的事情:

var str = 'foo bar(5) baz(0, 3)';
str.split(' '); // => ['foo', 'bar(5)', 'baz(0,', '3)']
Run Code Online (Sandbox Code Playgroud)

正如你所看到的结果不是我所期望的......有什么想法如何正确地分割它吗?我认为现在轮到RegExp这里的专家了......

更新

,一种简单的方法是将所有内容替换为,

str.replace(/, /g, ',').split(' ');
Run Code Online (Sandbox Code Playgroud)

但对我来说这看起来不太漂亮......

javascript regex string whitespace split

4
推荐指数
1
解决办法
1312
查看次数