按時間展開/摺疊手風琴。 HTML JS

-2

是否有可能使自動摺疊手風琴的時間？我試過在javascript中使用刪除類，但沒有發生，請檢查javascript，我的代碼的問題，請在html代碼中查看註釋。謝謝。按時間展開/摺疊手風琴。 HTML JS

<html> 
<head> 
<style> 
.acc-btn { 
    width:100%; 
    margin:0 auto; 
    padding:20px 25px; 
    background:#34495E; 
    border-bottom:1px solid #2C3E50; 
} 

.acc-content { 
    height:0px; 
    width:100%; 
    margin:0 auto; 
    background:#2C3E50; 
} 

.acc-content-inner { 
    padding:30px; 
} 

.open1 { 
    height: auto; 
} 

.open2 { 
    height: auto; 
} 

h1 { 
    font:700 20px/26px 'Lato', sans-serif; 
} 

</style> 
</head> 
<body> 

<script> 
function hideshow() { 
    classList.remove('open1', 'open2'); 
    var h = parseInt(new Date().getHours()); 
    if (h >= 1 && h < 2) { 
     classList.add('open1'); 
    } 
    if (h >= 23 && h < 1) { 
     classList.add('open2'); 
    } 
    hideshow(); 
    }(document.querySelector('.acc-container')); 
</script> 

<div class="acc-container"> 
    <div class="acc-btn"><h1>Heading 1</h1></div> 
    <div class="acc-content open1"><!-- I want collapse this at 01:00 till 02:00 --> 
     <div class="acc-content-inner"> 
     <p>Content</p> 
     </div> 
    </div> 

<div class="acc-btn"><h1>Heading 2</h1></div> 
    <div class="acc-content open2"><!-- I want collapse this at 23:00 till 01:00 --> 
     <div class="acc-content-inner"> 
     <p>Content</p> 
     </div> 
    </div> 
</div> 
</body> 
</html>

來源

2017-03-11 MUHAMMAD NAUFAL AZKIA

你有什麼已經嘗試過，不工作？我們不是源代碼提供者。我們可能會幫忙，但不能爲別人創建代碼 – Psi

@Psi我剛剛開始學習js，即時通訊如此迷茫，jst在高中就讀作業，我試過了，但沒有結果。所以即時刪除腳本。在谷歌搜索太值得我的時間，所以即時通訊來到這裏:-( –

您可以使用此：

var d = new Date(); 
if(d.getHours() > 18 && d.getHours() < 19) 
    $('.acc-btn').first().slideUp(); 
if(d.getHours() > 19 && d.getHours() < 20) 
    $('.acc-btn').last().slideUp();

來源

2017-03-11 15:16:28

按時間展開/摺疊手風琴。 HTML JS

回答

相關問題