해시 된 div의 jquery 이벤트

많은 div가있는 페이지가 있고 #DIV_NAME 을 사용하여 특정 div에 사용자를 연결하고 해당 div를 강조 표시하고 싶습니다.해시 된 div의 jquery 이벤트

나는

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

JQUERY

으로 시도하고 난 후 새로 고침 한번 페이지를로드 할 경우에만 작동합니다.

어떻게 페이지를 처음로드 할 때 작동하게 할 수 있습니까?

TNX

출처

2012-09-15 Dotan

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

사이

그냥 URL을 전환, 우리는 그것을 클릭; 짧은 시간 동안 페이지 lodes와 뉴스 항목이 강조 표시됩니까? – ygssoni

그런 것 같습니다. 페이지 내의 div를 강조하는 페이지와 같은 영구적 인 내용을 원합니다. – Dotan

로드 및 해싱 이벤트에 바인드하면됩니다. http://stackoverflow.com/a/12447340/1250044 – yckart

을 포함하는 것을 잊지, 당신은 달성 할 수 이 효과는 자바 스크립트없이 CSS 전용으로 제공됩니다.

CSS 3에서는 새로운 :target 유사 클럭 ^{[more info]}을 소개합니다.

다음 URL 의 해시 요소의 ID가 동일한 경우 CSS에서 대상 의사 선택 일치합니다. 여기

간단한 예 ( 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, 그래서 내가했던 것은 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 이벤트

답변

관련 문제