function close(input) { } $(function() { $("#closea").click(function() { if ($(this).hasClass("closea")) { $(this).removeClass("closea"); $("#closeimg").attr("src", "https://cdn3.iconfinder.com/data/icons/google-material-design-icons/48/ic_keyboard_arrow_up_48px-512.png"); } else { $(this).addClass("closea"); $("#closeimg").attr("src", "https://cdn3.iconfinder.com/data/icons/google-material-design-icons/48/ic_keyboard_arrow_down_48px-128.png"); } $("#closediv").slideToggle("slow"); }); }); 
 .close{ text-align: ; position: fixed; bottom: 0px; right: 0px; width: 40%; background: rgb(80, 80, 80); } .close:hover{ } #closediv{ } #closediv:hover{ } #closea{ background: rgba(80, 80, 80, 0.7) !important; cursor: pointer; text-align: center; display: block; } 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class='close'> <div> <a id='closea' onclick="close(this)" class="closea"> <img id='closeimg' src="https://cdn3.iconfinder.com/data/icons/google-material-design-icons/48/ic_keyboard_arrow_down_48px-128.png" style="width:30px"> </a> </div> <div id='closediv'> content content content content content content content content content content content content content content </div> </div>

How to make a block was originally open and when the page loads it closes up. and every 15 seconds the unit opened slightly but did not open. as if reminding myself

    1 answer 1

    setTimeout - executed once

    setInterval - executed until you stop execution yourself

    You should read https://learn.javascript.ru/settimeout-setinterval

     function close(input) { } $(function() { $("#closea").click(function() { if ($(this).hasClass("closea")) { $(this).removeClass("closea"); $("#closeimg").attr("src", "https://cdn3.iconfinder.com/data/icons/google-material-design-icons/48/ic_keyboard_arrow_up_48px-512.png"); } else { $(this).addClass("closea"); $("#closeimg").attr("src", "https://cdn3.iconfinder.com/data/icons/google-material-design-icons/48/ic_keyboard_arrow_down_48px-128.png"); } $("#closediv").slideToggle("slow"); }); setTimeout(function(){ $("#closediv").slideToggle("slow").addClass("smallHeight"); setInterval(lookAtMe, 5000); }, 5000); function lookAtMe() { $("#closediv").slideToggle("slow").delay(1000).slideToggle("slow"); } }); 
     .close{ text-align: ; position: fixed; bottom: 0px; right: 0px; width: 40%; background: rgb(80, 80, 80); } .smallHeight { height: 30px; } .close:hover{ } #closediv{ } #closediv:hover{ } #closea{ background: rgba(80, 80, 80, 0.7) !important; cursor: pointer; text-align: center; display: block; } 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class='close'> <div> <a id='closea' onclick="close(this)" class="closea"> <img id='closeimg' src="https://cdn3.iconfinder.com/data/icons/google-material-design-icons/48/ic_keyboard_arrow_down_48px-128.png" style="width:30px"> </a> </div> <div id='closediv'> content content content content content content content content content content content content content content </div> </div>

    • The arrow has a permanent display: none; and when viewing you need to reset the interval. - user207618
    • Well this is not a production, let's leave to my friend the opportunity to delve further on myself ?! - Mike
    • Common thought, comrade :) True, if this is a training demo, then you need to do it on another topic and, of course, with explanations. - user207618