哈希div上的jquery事件

我有一個很多div的頁面，我想用#DIV_NAME 將用戶引導到某個div，並突出顯示div。哈希div上的jquery事件

我用jQuery

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

嘗試過了，如果我加載頁面一次，然後刷新一下才起作用。

我怎樣才能使它在第一次加載頁面時工作？

TNX

來源

2012-09-15 Dotan

之間

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

你們是不是要實現我們在堆棧溢出得到的效果，當我們點擊收件箱中的任何新的消息，我們一下就可以了;頁面節點和新聞項目會突出顯示一段時間？ – ygssoni

這樣的事情，是的。我想要一個永久頁面，突出頁面內的div – Dotan

只需將其綁定到負載和hashchange事件：http://stackoverflow.com/a/12447340/1250044 – yckart

作爲一個側面說明，就可以實現這種效果只在CSS中，沒有JavaScript。

CSS 3引入了新的:target pseudo-classe ^{[more info]}。

CSS中的：target僞選擇符與URL 中的散列值和元素的ID相同時匹配。

下面是一個簡單的例子（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-16 13:33:50 CronosS

這是一個很棒的解決方案！謝謝 – Dotan

你可以這樣說：

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

Here is the demo

不要忘了，包括jQuery UI的

來源

2012-09-15 16:52:25 ygssoni

謝謝，實際上我想調用此函數從的網址，所以我所做的是設置一個變量來檢查是否在URL中的div名稱，然後做你給我的功能。無論如何感謝幫助 – Dotan

$(window).bind('load hashchange', function() { 
    var hasih = window.location.hash.substring(1); 
    $('div').removeClass('div_highlight'); 
    $('div#' + hasih).addClass("div_highlight"); 
});

只需切換網址

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

來源

2012-09-16 13:41:12 yckart

哈希div上的jquery事件

回答

相關問題