How to Show/Hide a div based on day of the week with jQuery

By Mika | Published: 07/13/2010

JavaScritpt

  1.  
  2. <script type="text/javascript">
  3.         $(document).ready(function() {
  4.        
  5.         today=new Date()
  6.         thisDay=today.getDay()
  7.        
  8.         $("#sunday").hide();
  9.                 $("#monday").hide();
  10.                 $("#tuesday").hide();
  11.                 $("#wednesday").hide();
  12.                 $("#thursday").hide();
  13.                 $("#friday").hide();
  14.                 $("#saturday").hide();
  15.        
  16.        
  17.         if (thisDay == 0){
  18.            $("#sunday").show();
  19.         }
  20.  
  21.         if (thisDay == 1){
  22.            $("#monday").show();
  23.         }
  24.         if (thisDay == 2){
  25.             $("#tuesday").show();
  26.         }
  27.         if (thisDay == 3){
  28.             $("#wednesday").show();
  29.         }
  30.         if (thisDay == 4){
  31.             $("#thursday").show();
  32.         }
  33.  
  34.         if (thisDay == 5){
  35.             $("#friday").show();
  36.         }
  37.         if (thisDay == 6){
  38.             $("#saturday").show();
  39.         }
  40.        
  41.         });
  42. </script>
  43.  

Html

  1.  
  2. <div id="sunday">
  3.   <h3>Sunday</h3>
  4. </div>
  5. <div id="monday">
  6.   <h3>Monday</h3>
  7. </div>
  8. <div id="tuesday">
  9.   <h3>Tuesday</h3>
  10. </div>
  11. <div id="wednesday">
  12.   <h3>Wednesday</h3>
  13. </div>
  14. <div id="thursday">
  15.   <h3>Thrursday</h3>
  16. </div>
  17. <div id="friday">
  18.   <h3>Friday</h3>
  19. </div>
  20. <div id="saturday">
  21.   <h3>Saturday</h3>
  22. </div>
  23.  
This entry was posted in JavaScript, jQuery and tagged , , , , , , . Bookmark the permalink. Post a comment or leave a trackback: Trackback URL.

Post a Comment

Your email is never published nor shared. Required fields are marked *

*
*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Spam Protection by WP-SpamFree