滾動條自動隱藏，除非我調整頁面大小

我正在使用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

滾動條自動隱藏，除非我調整頁面大小

回答

相關問題