Question

有没有人知道我可以使用的任何插件会逐渐在元素周围实时绘制边框？例如，它会给人的印象是某人实际上是在一个元素周围画一个边框而不是一次只出现一个边框。

Answer 1

您可以逐步应用顶部边框，右边框，底部边框，左边框，延迟250毫秒或任何您喜欢的内容。

Answer 2

HTML：

<div id="myelement">
    draw a border around this element
</div>

JS：

$.fn.border = function() {
    var speed =  1000;
    var borderWidth = 5;
    var $el = $(this);

    $el.css('position','relative');

    var $div = $('<div/>');

    $div.css('position','absolute');
    $div.css('top','-'+borderWidth+'px');
    $div.css('left','-'+borderWidth+'px');
    $div.css('border', borderWidth+'px solid black');
    $div.css('width','0px');
    $div.css('height','0px');
    $div.css('z-index','999');

    $el.append($div);

    $div.animate({
        width: $el.outerWidth() + "px",
        height: $el.outerHeight() + "px"
    }, speed);
};

$('#myelement').border();

工作样本：http://jsfiddle.net/LSmQC/

jQuery实时绘制边框

2 个答案: