可折疊的magento分層導航

Question

有誰知道使magento layered navigation collapse and expand

我找到了這段代碼，但我不確定與dd dt類的jquery有關系

<dl id="narrow-by-list">
    <?php $_filters = $this->getFilters() ?>
    <?php foreach ($_filters as $_filter): ?>
        <?php if($_filter->getItemsCount()): ?>
            <dt><?php echo $this->__($_filter->getName()) ?></dt>
            <dd><?php echo $_filter->getHtml() ?></dd>
        <?php endif; ?>
    <?php endforeach; ?>
</dl>

Answer 1

<script type="text/javascript">
    jQuery(document).ready(function(){
        jQuery("dl#narrow-by-list> dd").hide();
        jQuery("dl#narrow-by-list> dt").click(function(){
            jQuery("dl#narrow-by-list> dd:visible").slideUp("fast");
            jQuery(this).next("dd").slideToggle("fast");
            return false;
        });
    });
</script>

Answer 2

1）在主題中包含jQuery庫（您可能必須使用NoConflict Mode）2）通過以下方式在主題中修改template / category / layer / view.phtml文件。

A）更改<dt><?php echo $this->__($_filter->getName()) ?></dt>

到<dt><a href="/"><?php echo $this->__($_filter->getName()) ?></a></dt>

如您所見，我們在中包裝了屬性過濾器名稱，因此它成為可單擊的鏈接。

B）然后在同一view.phtml中包含jquery代碼段

<script type="text/javascript">
/* <![CDATA[ */
jQuery(document).ready(function(){
jQuery("dl#narrow-by-list> dd:not(:first)").hide();
jQuery("dl#narrow-by-list> dt a").click(function(){
jQuery("dl#narrow-by-list> dd:visible").slideUp("fast");
jQuery(this).parent().next().slideDown("fast");
return false;
});
});
/* ]]> */
</script> 

Answer 3

<script type="text/javascript">

jQuery(document).ready(function(){
jQuery("dl#narrow-by-list> dd").show();
jQuery("dl#narrow-by-list> dt").click(function(){
jQuery(this).next("dd").slideToggle("slow");
return false;
});
});
</script>