0

我有一个包含很多 div 的页面,我想使用 #DIV_NAME 将用户引导到某个 div 并突出显示该 div。

我用 JQUERY 试过了

    var hasih = window.location.hash.substring(1);
    $('div#'+hasih).addClass("div_highlight");

它只有在我加载页面一次然后刷新时才有效。

我怎样才能让它在第一次加载页面时工作?

tnx

4

3 回答 3

1

附带说明一下,您可以仅在 css 中实现此效果,而无需 javascript。

CSS 3 引入了新的:target伪类[更多信息]

当 URL 中的哈希值和元素的 id 相同时,CSS 中的 :target 伪选择器匹配。

这是一个简单的例子(demo js fiddle):

HTML

<a href="#first">first</a> - <a href="#second">second</a> - <a href="#third">third</a>

<div id="first"></div>
<div id="second"></div>
<div id="third"></div>​

CSS

div{
    height: 50px;
    width: 50px;
    border: 1px solid black;            
}

div:target{
    border-color: red;
}
于 2012-09-16T13:33:50.823 回答
0

你可以这样做:

$('a').click(function(){
    var selector = $(this).attr('href');        
    $('html').animate({
        scrollTop: $(selector).offset().top
    }, 500,'',function(){
        $(selector).effect("highlight", {}, 1000);                             
    });
    return false;
});

这是演示

不要忘记包含 jQuery UI

于 2012-09-15T16:52:25.063 回答
0
$(window).bind('load hashchange', function() {
    var hasih = window.location.hash.substring(1);
    $('div').removeClass('div_highlight');
    $('div#' + hasih).addClass("div_highlight");
});

只需在 url 之间切换

http://jsfiddle.net/KWTmm/show/#hash1

http://jsfiddle.net/KWTmm/show/#hash2

于 2012-09-16T13:41:12.583 回答