메뉴에서 경로 이동 경로를 보여줍니다.

Question

products에 대한 글로벌 메뉴와 로컬 메뉴가 있습니다. 제품을 보여줄 때 '제품 링크'를 강조 표시하고 강조 표시된 링크가 빵 부스러기로 작동하도록 로컬 메뉴에 제품 및 하위 페이지의 이름을 강조 표시하고 싶습니다. jquery와 codeigniter 또는 jquery로 어떻게 이것을 할 수 있습니까?

<ul id="accordion"> 
<li class="pm"><h2><?php echo anchor('/products/thassos_wonder', 'Thassos Wonder+');?></h2> 
<ul class="product_menu"> 
    <h2><?php echo anchor('/products/thassos_wonder', 'Thassos Wonder+');?></h2> 
    <h2><?php echo anchor('/products/thassos_wonder_advantages', 'Thassos Wonder+ Advantages');?></h2> 
    <h2><?php echo anchor('products/thassos_wonder_associated_products', 'Associated Products');?></h2> 
    <h2><?php echo anchor('/products/thassos_wonder_brochure', 'Download TW+ Brochure');?></h2> 
</ul> 
</li> 


<li class="pm"><h2><?php echo anchor('/products/marble_wonder', 'Marble Wonder+');?></h2> 
<ul class="product_menu" id="mwmenu"> 
    <h2><?php echo anchor('/products/marble_wonder', 'Marble Wonder+');?></h2> 
    <h2><?php echo anchor('/products/marble_wonder_advantages', 'Marble Wonder+ Advantages');?></h2> 
    <h2><?php echo anchor('products/marble_wonder_associated_products', 'Associated Products');?></h2> 
    <h2><?php echo anchor('/products/marble_wonder_brochure', 'Download MW+ Brochure');?></h2> 
</ul> 
</li> 

<li class="pm"><h2><?php echo anchor('/products/polybond', 'Poly Bond+');?></h2> 
<ul class="product_menu" id="pbmenu"> 
    <h2><?php echo anchor('/products/polybond', 'Poly Bond+');?></h2> 
    <h2><?php echo anchor('/products/polybond_advantages', 'PolyBond+ Advantages');?></h2> 
    <h2><?php echo anchor('products/polybond_areas_of_applications', 'Areas of Applications');?></h2> 
    <h2><?php echo anchor('/products/polybond_brochure', 'Download Polybond+ Brochure');?></h2> 
</ul> 
</li> 

여기

로컬 메뉴의 jQuery 코드이다 : 여기서 로컬 메뉴 코드

$(function() { 
var pathname = location.pathname; 
var highlight; 
//highlight home 
if(pathname == "/"){ 
    highlight = $('ul#accordion > li:first > a:first'); 
    $('a.active').parents('li').addClass('active'); 
} 
else { 
    var path = pathname.substring(1); 
    if (path) 
     highlight = $('ul#accordion a[href$="' + path + '"]'); 
} 
highlight.attr('class', 'active'); 

// hide 2nd, 3rd, ... level menus 
$('ul#accordion ul').hide(); 

// show child menu on click 
$('ul#accordion > li > a.product_menu').click(function() { 
    //minor improvement 
    $(this).siblings('ul').toggle("slow"); 
    return false; 
}); 

//open to current group (highlighted link) by show all parent ul's 
$('a.active').parents('ul').show(); 

//if you only have a 2 level deep navigation you could 
//use this instead 
//$('a.selected').parents("ul").eq(0).show(); 

});

아직도 jquery를 배우므로 도움이 될 것입니다. 고마워요 - G

Answer 1

이렇게 할 수있는 방법 중 하나는 항상 body 태그와 anchor 태그를 ID로 지정하고 CSS 선택기를 사용하여 작업을 수행하는 것입니다.

컨트롤러의 이름으로 내 몸 태그에 ID를 지정하고 싶습니다. 매우 편리합니다. 이 경우

, '제품'으로 설정 한 ID가 귀하의 앵커에 대한 ID를이 결합하고 당신이 도우미가 될 것입니다 수행이

#products #productLink { 
    color: #ff8833; 
} 

또 다른 방법은 같은 CSS를 사용할 수있는 것이다 몸 태그 CI에서 현재 URI에 대한 링크를 확인하고 앵커에 '활성'클래스를 추가합니다.

function menu_anchor($uri = '', $title = '', $attributes = array()) 
{ 
    if ($uri == uri_string()) 
    { 
     $attributes['class'] = (isset($attributes['class'])) ? ' active' : 'active'; 
    } 

    return anchor($uri, $title, $attributes); 
} 

Answer 2

나는 CodeIgniter의 프레임 워크에서 URL에서 자동 빵 부스러기를 만들 수 있습니다 도우미 함수를 만들었습니다. 확인하시기 바랍니다 자세한 내용은

는 후 다음 -

http://www.thephpx.com/2010/05/12/codeigniter-helper-create-breadcrumb-from-url/

덕분에,

파이 http://www.thephpx.com/