如何突出显示 HTML 中的内容？ [关闭]答案

【问题标题】：How to highlight content in HTML? [closed]如何突出显示 HTML 中的内容？ [关闭]
【发布时间】：2012-05-21 15:32:05
【问题描述】：

我在同一页面上创建了链接。此页面的内容位于底部，锚选项卡位于顶部。

当有人点击顶部链接 (ancho) 时，我想突出显示内容区域 5 秒。

【问题讨论】：

您能否更详细地描述您的问题？ “内容”是什么意思，它是一个元素，还是元素内的文本？
向我们展示您目前所拥有的。粘贴一些相关代码
在选择文本时突出显示还是什么？

标签： php jquery html css

【解决方案1】：

看看 jQuery 和 Effects-Plugin。

http://docs.jquery.com/UI/Effects/Highlight

【讨论】：

@little big rot 和 Roko C.buljan 我的意思是元素内的文本

【解决方案2】：

你可以通过很多种方式做到这一点，例如绑定 onHashChange 然后改变背景颜色：

$(window).bind('hashchange', function(){
    $(".highlight").css("background","#AFA");
    setTimeout(function(){
        $(".highlight").css("background","transparent");
    },5000);
});

http://jsfiddle.net/X8kBj/1/

【讨论】：

【解决方案3】：

给每条内容一个唯一的id，如下：

<div id="content_1"> ... </div>

然后使用jQuery为每个链接设置事件：

$("div").delegate("#content_1", "click", function() {
  $('div.content_1').effect("highlight", {}, 3000);
});

或者你可以使用 .on() 或 .live() 但你明白了。

【讨论】：

最好使用.on()和not use .live()。

【解决方案4】：

使用delay()

$('#id-of-anchor').click(function(){

 $("#your-div").css('background','red').delay(5000).css('background','transparent');
 return false;    

});

【讨论】：