滚动条自动隐藏，除非我调整页面大小

我正在使用js插件来创建滚动条。基本上，当你加载页面时，它自动设置为“display：none”，当它不应该。然后，如果您调整浏览器的大小，它会自动切换到“display：block”并正常工作。我不能为我的生活弄清楚什么是错误的，特别是因为它是过去两个（不同的ID）代码的一个完全正确的复制品。滚动条自动隐藏，除非我调整页面大小

我相信这是相关的代码，但如果需要，我可以包含其他作品。 mcs3_container是什么需要一个滚动条。

/*----PART 4----*/ 
/*----LOCATIONS----*/ 
echo ' 
    <div class="reserveAPickupAppointmentForm" id="reserveAPickupAppointmentForm4"> 
    <div class = "reserveAPickupAppointmentText"> 
     Please choose from the following locations: 
    </div> 
    <br />'; 

$sql = " 
    SELECT DISTINCT timeBlocks.location 
    FROM timeBlocks 
    WHERE 
    timeBlocks.school = '".$_SESSION["school"]."' 
    AND timeBlocks.date >= CURDATE() 
    ORDER BY timeBlocks.priority; 
"; 

include "databaseConnection.php"; 
mysql_close($connection); 

if (mysql_num_rows($result) == 0) { 
    echo 'There are currently no appointments available online. Time blocks for pick ups during move-out week are released after Spring Break, and you can reserve an appointment at that time. If you want to schedule a custom appointment during a different time of the year, please email or call us, and we can help to create a custom pick up.'; 
} else { 
    echo ' 
    <div id="mcs3_container"> 
     <div class="customScrollBox"> 
     <div class="container"> 
      <div class="content">'; 
    mysql_data_seek($result, 0); 
    while ($row = mysql_fetch_array($result)) { 
    echo ' 
      <div class = "reserveAPickupAppointmentLocationText reserveAPickupAppointmentButtonText">'..$row["location"].'</div> 
      <div class="buttonBreak">&nbsp;</div>'; 
    } 
    echo ' 
      <noscript> 
       <style type="text/css"> 
       #mcs_container .customScrollBox{overflow:auto;} 
       #mcs_container .dragger_container{display:none;} 
       </style> 
      </noscript>'; 
    echo ' 
      </div> 
     </div> 
     <div class="dragger_container"> 
      <div class="dragger"></div> 
     </div> 
     </div> 
     <!-- scroll buttons --> 
     <a class="scrollUpBtn" href="#"></a> 
     <a class="scrollDownBtn" href="#"></a> 
    </div>'; 
} 
echo ' 
    </div>'; 
echo ' 
    <script> 
    $(window).load(function() { 
     $("#mcs3_container").mCustomScrollbar("vertical",400,"easeOutCirc",1.05,"fixed","yes","yes",10); 
    }); 
    </script>';

来源

2012-02-20 radleybobins

请缩进理智，如果你希望其他人能够把它捡起来你的代码并理解它... – DaveRandom 2012-02-20 23:54:57

@Dave，它看起来就在我的电脑上，但我遇到了一些与stackoverflow麻烦...还，我道歉，我在右手臂手术，我卡住单手打字。 – radleybobins 2012-02-20 23:55:43

够公平的，确保它看起来正确无处不在的一个提示是使用空格代替缩进，各种不同的rednering引擎显示标签的方式非常不同... – DaveRandom 2012-02-21 00:07:26

运行mCustomScrollbar插件后，触发window对象的resize事件。幽州一旦你重新大小的视口，它工作正常，这只是自动触发该重新大小：

$(window).load(function() { 
    $("#mcs3_container").mCustomScrollbar("vertical",400,"easeOutCirc",1.05,"fixed","yes","yes",10); 
    $(window).trigger('resize'); 
});

来源

2012-02-20 23:55:38 Jasper

非常聪明，我现在试着这个 – radleybobins 2012-02-20 23:58:15

不，很抱歉，它仍然只会在手动调整浏览器时弹出...发生在所有浏览器 – radleybobins 2012-02-21 00:02:15

等待，我骗！我将这个解决方案放在我的普通scripts.js文件的稍微不同的地方。非常感谢。 – radleybobins 2012-02-21 00:17:23

滚动条自动隐藏，除非我调整页面大小

回答

相关问题