Magento响应主题:菜单未显示在980和740宽度之间

时间:2014-03-27 12:56:13

标签: javascript css twitter-bootstrap magento mobile

  

http://www.acuity-sports.com/basketball.html

以上是该网站的链接。我正在使用的响应主题隐藏了980到740宽度之间的移动菜单。

http://responsivepx.com/?www.acuity-sports.com%2F#900x564&scrollbars

我的问题是需要修复的引导程序还是与菜单本身相关的.css。这个让我难过。

这是引导程序中的@media:

@media (min-width: 768px) and (max-width: 979px) {
.header-bottom .container, .header-bottom .container .span12, 
.topsl-wrap .container, .topsl-wrap .container .span12, 
.cms-home .slide-wrap .container, 
.cms-home .slide-wrap .container .span12 {
    width:754px;    
}   
/*.block-feature-products .row > div:first-child +div , */
.block-feature-products  .row > div:first-child {   display:none; }

.header-top .container,
h1#logo{padding:0!important;}
.header-top #nav,

.mega-menu .social {    display:none; }
.plus-button{left: 115px;}
.wrapper .col2-left-layout .main{background:none!important;}
.col2-left-layout #sm_footer{padding:0!important;}
/* .col2-left-layout .col-left{display:none} */
.col2-left-layout .col-left > [class*="span"] > div{    margin-top:0;   display:block;  }
.col2-left-layout .col-left > [class*="span"] > div ~ div{  display:none;   }

.wrapper .col2-left-layout{margin:0 auto;}
.quick-access .shop-access {    float:right;}
.item-li3 a{padding-left: 20px!important;}
.li-add{padding-left: 5px;}
.paging-btn{right: 100px!important;}
#best-sales li.item{margin-right:8px!important;min-height: 218px!important;}
#best-sales .item-description{  margin-bottom: 25px; }
.cms-home .products-grid li.item{width:138px!important;}
.cms-home .products-grid li.item .product-image img{width:135px!important;}

.yt-slider .products-grid .item-inner .item-box div.product-image {
  padding:0 !important;
}

.banner-g1 a{ padding: 0 0 0 0!important;   width:100%; }
.banner-g1 a:first-child{ padding: 0 0 25px 0!important;}
.cms-home .products-grid li.item{margin-right:6px!important;}
div.product-name a{font-size:15px!important;}
.manu-items img{width: 90px;}
.bottom-footer .sm-glasses,.bottom-footer .contact-us,.bottom-footer .choose-us,.bottom-footer .popular-tags{margin-right:5px!important;}
/* .block-content ul li img{width: 50px;} */
.sm-glasses li{margin-right:10px!important;}
input#newsletter{width: 140px!important;}
.block-newsletter label{font-size:14px!important;}
#sm_header{ overflow: visible!important;}
.col1-layout #sm_footer{width: 724px!important; padding: 0 !important;}

/*  code standard responsive */
.bottom-footer {    display:none; }
.category-products .popup-box { width:auto;  }

/* process form  */
.input-box input,
.input-box textarea {   width:170px ; }
input#productTagName {  width:360px !important; }       
select {    width:190px;    }
#contactForm { /* width:200px */; }
.yt-slider .products-grid { margin:0; }
/* #sm_slideshow { font-size:80%; }  */
#sm_slideshow .custom-content span.content-sl4 { width: 360px; margin-top:10px; margin-left:5px; }
#sm_slideshow .custom-title a.title-sl4 { margin-left:5px; }
#sm_slideshow .video-sl4 { max-width:380px; }
.header-top .language-switcher .jqTransformSelectWrapper div span{
    padding-left:5px;
}
.header-top .currency-switcher{
    padding-left:4px;

1 个答案:

答案 0 :(得分:1)

@media (min-width: 768px) and (max-width: 979px)中你用js隐藏了菜单。见下面的链接。我认为你的javascript没有为给定的分辨率设置显示块。

http://screencast.com/t/TwXUPFhxsh