如何更改此导航栏的断点

时间:2018-07-23 08:53:46

标签: html css twitter-bootstrap navbar nav

目前,导航设置为767px断点,我不确定如何将其更改为900px的断点。它说的是导航开始的位置,并且它正在使用引导程序来调整导航大小

下面是显示菜单的代码,我尝试了其他方法,但是它不起作用,如果您需要对代码进行任何编辑,请告诉我

感谢您的帮助!

    <html>


<head>
    <meta name="viewport" content="width=device-width , initial-scale=1" />
   <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>      



</head>

    <body>

  <div class="quick-access" id="quick-access" >
                <div class="checkout-link"><?php echo $this->getChildHtml('checkoutLinks') ?></div>

                <?php echo $this->getChildHtml('topCart') ?>
                <?php echo $this->getChildHtml('CustomerLinks') ?>
            </div>




  <!-- navbar -->
  <nav class="navbar navbar-default" role="navigation">
     <div class="navbar-header">
       <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
           <span id="menu_text">
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
           </span>

  </button>




     </div>
     <div class="collapse navbar-collapse" id="myNavbar">
     <ul class="nav navbar-nav nav-collapsing top" id="htmTools">




            <!-- static block: nav_before_products, Home -->

          <li><a href="#"> <?php
            $nav_before_products = $this->getLayout()->createBlock('cms/block')->setBlockId('nav_before_products')->toHtml();
            if ($nav_before_products){
                echo $nav_before_products;
            }
        ?></a></li>

          <!--Show Catorgories if Customer is Logged in -->

          <?php if((Mage::helper('customer')->isLoggedIn())){ ?>
          <?php foreach($categories as $category): ?>
            <?php $category = Mage::getModel('catalog/category')->load($category->getId()) ?>
            <?php $subcategories = $category->getChildrenCategories() ?>


          <li class="<?php if (count($subcategories) > 0){ echo 'magento_backend_catorgories_drop';} else { echo 'magento_backend_catorgories';} ?>" >

  <?php if (count($subcategories) > 0) { ?>
    <i id="dropdown-icon1" class="glyphicon glyphicon-chevron-down"></i>
<?php } ?>



            <a href="<?php echo $helper->getCategoryUrl($category) ?>" title="Navigate to <?php echo $category->getName() ?>"><?php echo $category->getName() ?></a>

            <?php if (count($subcategories) > 0): ?>

                <div class="row dd_cont" id="ddcontimportant" style="z-index: 9999; left: 0px !important;">

                <ul class="multi-column-dropdown" style="padding:30px !important;">

                    <?php foreach($subcategories as $subcategory): 
                        $col = Mage::getModel('enterprise_catalogpermissions/permission')->getCollection()
                                ->addFieldToFilter('category_id', $subcategory->getId())
                                ->addFieldToFilter('customer_group_id', Mage::getSingleton('customer/session')->getCustomer()->getGroupId())
                                ->addFieldToFilter('grant_catalog_category_view', Enterprise_CatalogPermissions_Model_Permission::PERMISSION_DENY);        
                        if (sizeof($col)) continue; ?>

                        <li class="dropdown-submenu">
                            <a style="padding: 10px !important;" class="listheader dropdown-toggle" href="<?php echo $helper->getCategoryUrl($subcategory) ?>"><?php echo $subcategory->getName() ?></a>
                            <?php $subcategory = Mage::getModel('catalog/category')->load($subcategory->getId()) ?>
                            <?php $subsubcategories = $subcategory->getChildrenCategories() ?>
                            <?php if (count($subsubcategories) > 0): ?>

                                <ul class="subsubcat">
                                    <?php foreach($subsubcategories as $subsubcategory): 
                                         $col = Mage::getModel('enterprise_catalogpermissions/permission')->getCollection()
                                            ->addFieldToFilter('category_id', $subsubcategory->getId())
                                            ->addFieldToFilter('customer_group_id', Mage::getSingleton('customer/session')->getCustomer()->getGroupId())
                                            ->addFieldToFilter('grant_catalog_category_view', Enterprise_CatalogPermissions_Model_Permission::PERMISSION_DENY);        
                                        if (sizeof($col)) continue;?>

                                        <li>
                                            <a href="<?php echo $helper->getCategoryUrl($subsubcategory) ?>"><?php echo $subsubcategory->getName() ?></a>
                                        </li>

                                    <?php endforeach; ?>
                                </ul>

                                    <?php endif; ?>
                        </li>
                    <?php endforeach; ?>

                </ul>
                    </div>



            <?php endif; ?>
            <?php

            if(in_array($category->getId(), $catProList)){

                $parray = array();

                foreach($catProList as $pid=>$cat){

                    if($cat == $category->getId()){

                       $parray[] = $pid;
                    }
                }

               echo $layout->getBlock('services_toplink')->setProgramId($parray)->toHtml();
            }?>
        </li>
        <?php endforeach; ?>
        <?php } ?>




          <li class="dropdown-submenu" id="dropdownmenu">
              <a class="dropdown-toggle" data-toggle="dropdown" href="#"><i style="color: #B40000 !important;font-size: 12px; padding-right: 10px; text-transform: uppercase;" class="fas fa-user-alt"></i><b style="color: #B40000 !important; text-transform: uppercase !important; font-size: 12px;">My Account</b><i style="color: #B40000 !important;" id="dropdown-icon" class="glyphicon glyphicon-chevron-down"></i></a>
            <ul style="width: 250px !important;" class="dropdown-menu dropdown-menu-left" >
              <div class="row">
                        <div class="col-sm-3" style="width: 125% !important">
                            <ul class="multi-column-dropdown" id="dropdown-account">



                                <li><a id="linkblack" href="/customer/account/">Account Dashboard</a></li>
                                                    <li class="divider"></li>
                                <li><a id="linkblack" href="/customer/account/edit/">Account Information</a></li>
                                                    <li class="divider"></li>
                                <li><a id="linkblack" href="/customer/address/">Address Book</a></li>
                                                    <li class="divider"></li>
                                <li><a id="linkblack" href="/customer/account/correspondenceaddress/">Correspondence Address</a></li>
                                                    <li class="divider"></li>
                                <li><a id="linkblack" href="/sales/order/history/">My Orders</a></li>
                                                    <li class="divider"></li>
                                <li><a id="linkblack" href="/sales/billing_agreement/">Billing Arrangements</a></li>
                                                    <li class="divider"></li>
                                <li><a id="linkblack" href="#">My Connect Subscriptions</a></li>
                                                    <li class="divider"></li>
                                <li><a id="linkblack" href="/oauth/customer_token/">My Applications</a></li>
                                                    <li class="divider"></li>
                                <li><a id="linkblack" href="/downloadable/customer/products/">My Downloadable Products</a></li>
                                                    <li class="divider"></li>
                                <li><a id="linkblack" href="/rma/return/history/">My Returns</a></li>

                                                    <br/>

                            </ul>
                        </div> 
                            </ul>



                <li class="dropdown-submenu" id="dropdownmenu2">
              <a class="dropdown-toggle" data-toggle="dropdown" href="../../checkout/cart/"><i style="color:  !important; font-size: 12px; padding-right: 10px; text-transform: uppercase;" class="fas fa-shopping-cart"></i><b style="text-transform: uppercase !important; font-size: 12px;" > My Cart</b><i style="color: !important;" id="dropdown-icon" class="glyphicon glyphicon-chevron-down"></i></a>
            <ul style="width: 170px !important;" class="dropdown-menu dropdown-menu-left">
              <div class="row">
                        <div class="col-sm-3" style="width: 115% !important">
                            <ul class="multi-column-dropdown" id="dropdown-account">



                                <li><a id="linkblack" href="/checkout/cart/">My Cart</a></li>
                                                    <li class="divider"></li>
                                <li><a id="linkblack" href="../../wishlist/">My Wishlist</a></li>
                                                    <li class="divider"></li>
                                                    <li><a id="linkblack" href="../../checkout/onepage/"><b style="color: green;">Checkout</b></a></li>



                                                    <br/>

                            </ul>
                        </div> 
                            </ul>



            </li> 






     </div>
      <?php echo $this->getChildHtml('CustomerLinks') ?>







  </nav>




<script type="text/javascript">
//<![CDATA[
jQuery(function($){
    jQuery("ul.top li").hover(function(){
        // #hoverStart
        var item = jQuery(this);                     //ref anchor obj
        item.toggleClass("hover");              //enable hover class
        var sub_item = item.find('.dd_cont');   //what to dropdown obj
        sub_item_count = sub_item.length;
        if (sub_item_count){
            var sub_item_count = sub_item.find('.subcat').children().length;
            var parent = item.parent();             //anchors parent obj
            var supernav = parent.parent();         //the top most container of the nav
            var block_size = '175';                 //width of block container

            //positioning
            item_pos        = item.position();      //get position of the anchor
            sub_item_pos    = sub_item.position();  //get position of the dropdown item
            sub_item_width  = sub_item.width();     //get width of the dropdown item

            //set the vertical position
            sub_item_top = item_pos.top + item.height();
            sub_item_left = item_pos.left+8;
            //set dropdown width based on number of subcat *
            block_size = block_size * sub_item_count;

            //give position of anchor to the dd item & change class to show the box
            sub_item.css({left:sub_item_left,top:sub_item_top,width:block_size}).toggleClass("dd_show");
        }
    }, function(){
        var item = jQuery(this);
        item.toggleClass("hover").find('.dd_cont').css({left: '-1000em'}).toggleClass("dd_show");
    });});

//]]>




</script>
</body>

</html>

0 个答案:

没有答案
相关问题