jQuery 및 CSS 팝업 메뉴 링크 문제

CSS 및 jQuery를 사용하여 하단 바 메뉴를 개발하는 중입니다. 그것은 본질적으로 사용자가 사이트의 다른 기능에 빠르게 액세스 할 수있게 해주는 영구 메뉴입니다.jQuery 및 CSS 팝업 메뉴 링크 문제

바는 마우스 커서를 올려 확인한 경우 여러 옵션이있는 작은 컨텍스트 메뉴를 공개하는 것이, 작은 아이콘 (클래스 "메뉴 항목")로 구성되어 있습니다. 이 div 안의 옵션은 클릭 할 수 있어야하지만 이미지 아이콘 자체도 연결 가능해야합니다.

HTML은 #profile 대한 CSS 버튼에 대한 특정 이미지를 지정하는 경우, 다음과 같이 구성되어있다. 이미지를 가리킬

는

<div id="profile" class="menu-item"> 
    <div id="profile-tip" class="tip tip-submenu"> 
    <div class="tip-profile">--Profile Content--</div> 
    </div> 
</div>

, "프로필 팁은"DIV 내가 정보 아이콘을 클릭 할 수하고자하는이 요컨대 다음 JavaScript

$(".menu-item").hover(function() { 
    $(this).find("div").fadeIn("fast").show(); //add 'show()'' for IE 
$(this).mouseleave(function() { //hide tooltip when the mouse moves off of the element 
    $(this).find("div").hide(); 
}); 
});

을 사용하여 달성되는, 표시되기 예를 들어, "profiles.php"페이지에 링크하십시오.

이 솔루션이 적용

<div id="profile" class="menu-item" onClick="window.location.href='profiles.php'"> 
    <div id="profile-tip" class="tip tip-submenu"> 
    <div class="tip-profile">--Profile Content--</div> 
    </div> 
</div>

, 그것은 팝업 메뉴에 대한 모든 클릭을 발생합니다. (즉,하지 아이콘 자체)도 링크 : 나는 다음이 쉽게 적용함으로써 달성 될 수 있다고 생각 같은 위치.

위의 내용을 해독하고 도움을 주시면 감사드립니다. 필요한 경우 더 많은 정보를 제공하고자합니다.

출처

2011-03-18 Sam

내가 여기 당신을 위해 뭔가를 요리 : http://jsfiddle.net/qstv9/

출처

2011-03-18 06:35:53 moe

하이 모에 :-) 그것을 시도, 코드가 우수한 작업처럼, 난 단지 그는 또한 내부 옵션을 좋아하는 그의 소개에 읽어 보인다 div (툴팁)을 클릭 할 수 있습니까? 아니면 잘못 되었나요? –

안녕하세요, 모에, 답장을 보내 주셔서 감사합니다. 올바른지, "div"(툴팁) 안의 옵션을 클릭 할 수 있어야합니다. 본질적으로 그것은 플라이 아웃 메뉴가됩니다. 그래서 첫 번째 회색 사각형 위로 마우스를 가져 가면 프로필에 연결되는 링크를 클릭하면 div가 여러 개의 다른 링크와 함께 표시됩니다 (개별적으로 클릭 할 수 있음). 더 이상의 도움을 받으실 수 있습니다. – Sam

약간의 수정이되었으므로 이후의 내용을 더 잘 이해하고 있습니다. http://stackoverflow.com/questions/5373386/jquery-find-div -도움 – Sam

jQuery 및 CSS 팝업 메뉴 링크 문제

답변

관련 문제