SOUTH POLE

SOUTH POLE

This is my very first static website created by HTML, CSS, JavaScript and jQuery. This website is about south pole and planed to be for kids to learn about the country, but contents is made so adult can also enjoy.

PLANNING PROCESS

Planning started by deciding which country to pick, and website’s design/main colors/contents and structure. All page of this site are created by mobile first, and JavaScript is used on navigation bar so that it changes between break points.

LANGUAGE | TOOLS

 

FEATURED

 

Hamburger menu (Responsive)


const nav = document.getElementById('nav-to-toggle');
const btn = document.getElementById('nav-button');

btn.addEventListener('click', _ => nav.classList.toggle('show'));

// prevent default
btn.addEventListener('mousedown', (e) => { e.preventDefault() });
 

 

Question page with accordion function with jQuery


$(function() {
    $('.question').click(function() {
      var $answer = $(this).find('.answer');
      //Check if answer is already open...
      if($answer.hasClass('open')) { 
        $answer.removeClass('open');
        // Hide answer
        $answer.slideUp();
        // Change text from "-" to "+"
        $(this).children('span').text('+');
      } else {
        $answer.addClass('open'); 
        //Show $answer
         $answer.slideDown();
        // Change text from "+" to "-"
        $(this).children('span').text('-');  
      }
    });
  });
 

 

SCREENSHOTS

 

 

 

Follow Me