jQuery로 숨겨진 HTML 요소가 링크 클릭시 다시 나타나지 않습니다.

콘텐츠 섹션이 다른 여러 div가있는 페이지가 있습니다. 초기에는 홈 페이지 컨텐츠가 .active로 설정되고 나머지는 숨겨집니다. 탐색 막대에서 링크를 클릭하면 현재 활성 내용이 페이드 아웃되고 새 내용이 페이드 인됩니다.jQuery로 숨겨진 HTML 요소가 링크 클릭시 다시 나타나지 않습니다.

현재이 방법은 거의 완벽하게 작동합니다. 그러나 콘텐츠 div의 모든 텍스트 링크는 보이지 않습니다 (링크가있는 이미지는 잘 보입니다). 텍스트 링크는 보이지 않지만 링크가 표시되어야하는 빈 공간 위로 마우스를 이동하면 클릭 할 수 있습니다.

예 HTML :

<body> 
<div class="content_wrapper"> 
    <div id="nav"> 
    <ul id="navlist"> 
    <a id="about" class="showHideLink"><li>ABOUT</li></a> 
    <a id="media" class="showHideLink"><li>MEDIA</li></a> 
    <a id="blog" class="showHideLink"><li>BLOG</li></a> 
    </ul>  
    </div> 

    <div id="page-wrap"> 
    <!-- Content --> 

    <div id="home-content" class="section active"> 
    <h1>WELCOME</h1> 
    Welcome to our site!<br /> 
    Check out our YouTube channel: <a href="http://www.youtube.com/user/Foo/" target="_blank">Here</a><!-- **This link is invisible** --> 
    </div> 

    <div id="about-content" class="section"> 
    <h1>About</h1> 
     About Us. [<a href="#citation1" alt="Citation Link">1</a>]<!-- **This link is invisible** --><br /> 
     <br /> 
     [<a id="citation1">1</a>] <a href="mycitation.html" target="_blank">Citation Title</a> <!-- **This link is invisible** --> 
    </div> 

    </div> 
    </div> 
</body>

자바 스크립트 :

<script type='text/javascript'> 
$(document).ready(
    function() { 
    $(".section").hide(); 
    $(".active").fadeIn(); 

    $("a.showHideLink").click(function(){ 
    var _contentId = '#' + $(this).attr('id') + "-content"; 

    if(!$(_contentId).hasClass("active") && $(_contentId).length) 
    { 
    $(".active").stop().fadeToggle(function(){ 
    $(".active").removeClass("active"); 
    $(_contentId).fadeToggle(); 
    $(_contentId).addClass("active"); 
    } 
    ); 
    } 
}); 
}); 
</script>

어떻게 변경할 수 있습니다 그래서 또한 내가 발견하지 않았습니다이 버그에 의해 영향을받을 수있는 링크 (그리고 다른 가능한 내용 아직) 콘텐츠 섹션에서 볼 수 있습니까? 감사

편집

: http://uoflusli.com/index_off.php

출처

2011-10-11 Conor

그래서 링크 만 보이지 않습니까? 예를 들어 '정보'헤더를 볼 수 있습니까? –

페이지를 보여줄 수 있습니까? – Andy

간단한 데모 http://jsfiddle.net/jkeyes/TLE6u/을 만들었고 링크가 표시됩니다. 라이브 사이트에 연결할 수 있습니까? –

문제는 그 연결이 a:-webkit-any-link의 스타일을 얻고있다 및 배경과 같은 렌더링입니다 : 다음은 라이브 사이트에 대한 링크입니다. 색상이없는 물건을보기가 어렵습니다.

이 문제는 쉽게 발견 할 수 있습니다. Chrome을 사용하여 링크를 마우스 오른쪽 버튼으로 클릭하고 요소 검사를 선택합니다. CSS 캐스케이드가 노출되어 있습니다 (말장난 의도).

행운을 비네.

출처

2011-10-11 21:35:27 Hogan

js 컨텐츠 전환기를 구현 한 후에 링크가 사라 졌으므로 js 관련성이 있어야합니다. 그걸 봤어야 했어. 나를 가리켜 주셔서 감사합니다. 건배. – Conor

jQuery로 숨겨진 HTML 요소가 링크 클릭시 다시 나타나지 않습니다.

답변

관련 문제